How to use automatic CSS hyphens with `word-break: break-all`?

后端 未结 3 1697
粉色の甜心
粉色の甜心 2020-12-01 16:03

I\'m using word-break: break-all; and want to know how I can have the browser automatically insert the hyphens, as demonstrated in an MDN example.

3条回答
  •  隐瞒了意图╮
    2020-12-01 16:19

    The word-break property and hyphenation are two completely different things. The first one, originally intended for East Asian languages mainly, does bad things to languages like English: it arbitr arily cuts w ords at some poi nts without ind icating that a word has been broke n.

    So you should decide whether you have an expression where a line break can be inserted by a browser at any point or whether you want hyphenation.

    For hyphenation, the CSS code as such is OK, though many people would advice putting the standard property setting hyphens: auto last, after prefixed properties. But it requires that the language of the text be declared in HTML markup, using e.g.

    . Moreover, browser support is still limited: IE 9 does not support such hyphenation, and the support in IE 10 covers a relatively small set of languages (including English of course).

    For automatic hyphenation on IE 9, you would need to use either server-side programmed hyphenation or, simpler, client-side hyphenation with tools like Hyphenator.js.

提交回复
热议问题