Is it possible to enable auto-hyphenation in HTML/CSS?

前端 未结 4 1047
既然无缘
既然无缘 2020-12-12 20:42

My client has requested to enable auto-hyphenation on this page: http://carlosdinizart.com/biography/ , and I realized I\'ve never actually seen it done on a web-page.

4条回答
  •  囚心锁ツ
    2020-12-12 21:21

    CSS3 provides some support for this. Source: http://drublic.de/blog/css3-auto-hyphenation-for-text-elements/ You can check the w3c documentation here: http://www.w3.org/TR/2011/WD-css3-text-20110901/#hyphenation

    CSS3 adds six properties to the list of useful thing. These are:

    • The most important one is hyphens.
    • You can add dictionary-files with hyphenate-resource so the browser has a better chance to render your text with the right hyphenation.
    • hyphenate-before sets a minimum number of characters before the hyphenation.
    • hyphenate-after does the same as hyphenate-before but for characters after the hyphenation.
    • hyphenate-lines defines about how many lines a hyphenated word is written at a maximum. with hyphenate-character you can specify which HTML-entity should be used, e.g. \2010.

    The main property of this stack is hyphens. It accepts one of three values: none, manual or auto. The default one is manual, where you can set hyphens via ­. auto it the better one for continuous text while words get split if possible and available. And none does not hyphenate at all even if there is a character set for a possible line break in a certain word.

    Update:

    Browser support information here: http://caniuse.com/css-hyphens

提交回复
热议问题