word-break
Поддержка браузерами
| 12.0+ | 5.5+ | 15.0+ | 4.0+ | 15.0+ | 3.1+ |
Описание
CSS свойство word-break определяет правила переноса для не-CJK сценариев.
CJK - китайские, японские и корейские сценарии.
| Значение по умолчанию: | normal |
|---|---|
| Применяется: | ко всем элементам |
| Анимируется: | нет |
| Наследуется: | да |
| Версия: | CSS3 |
| Синтаксис JavaScript: | object.style.wordBreak="hyphenate" |
Синтаксис
word-break: normal|break-all|keep-all|inherit;
Значения свойства
| Значение | Описание |
|---|---|
| normal | Используются правила, заданные по умолчанию. |
| break-all | Определяет перенос между любыми двумя символами. |
| keep-all | Запрещено разрывать слова для переноса. |
| inherit | Указывает, что значение наследуется от родительского элемента. |
Пример
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Пример</title>
<style>
p.test1 {
width: 11em;
border: 1px solid #000000;
word-break: hyphenate;
}
p.test2 {
width: 11em;
border: 1px solid #000000;
word-break: break-all;
}
</style>
</head>
<body>
<p class="test1">Этот абзац содержит текст. Эти строки будут переноситься
только в подходящих местах.</p>
<p class="test2">Этот абзац содержит текст. Эти строки будут переноситься
на любом символе.</p>
</body>
</html>
Результат данного примера в окне браузера: