css властивість word-break
CSS властивість word-break вказує тип перенесення слів, котрі не поміщаються по ширині в задану область. Ця властивість не працює з CJK.
Властивість word-break схожа на властивість word-wrap, оскільки вона може створювати перерви в межах слів, однак, різниця полягає в тому, що word-wrap розбиває слово лише на цілі частини (тобто якщо воно занадто довге, щоб влізти у контейнер), тоді як word-break дозволяє розбивати слова навіть тоді, коли вони могли б бути перенесеними до наступного рядка.
На відміну від overflow-wrap, word-break створить розрив в точному місці, де текст переповнює контейнер (навіть якщо повне слово може розміститися на наступному рядку і це зніме необхідність розриву).
| Нотатка: | CJK (Chinese, Japanese та Korean) китайська, японська і корейська мови. |
| Нотатка: | Chrome до версії 44, Opera до версії 31, Safari до версії 9, Android і Opera Mobile не підтримують значення |
Синтаксис
word-break: normal|break-all|keep-all|initial|inherit;Властивість word-break може отримувати 5 значень:
normalЗвичайні правила перенесення слів. Слова не переносяться або переносяться, тільки там, де явно задане перенесення. Це значення без задання.
break-allСлово може перенестися між будь-якими двома літерами.
keep-allПеренесення заборонені між буквами. Перенесення відбувається тільки між словами.
initialВстановлює цю властивість в значення без задання
inheritУспадкує значення властивості від свого батьківського елемента
| Значення без задання: | normal |
|---|---|
| Наслідує: | Так |
| Анімується: | Ні |
| JavaScript синтаксис: | object.style.wordBreak="break-all" |
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| word-break | 44.0 |
5.5 |
15.0 |
9.0 |
31.0 |
12.0 |
| Переглядач | |||
|---|---|---|---|
| word-break | 2.1 -webkit- |
15.0 |
9.2 |
Мобільних переглядачів ще не додано.