| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 10.0+ | 13.0+ | 5.1+ | 8.0+ | 4.0+ | 4.2+ |
Коротка інформація
| Значення за замовчуванням | ручний |
|---|---|
| Наслідується | Так |
| Застосовується | До всіх елементів |
| Посилання на специфікацію | http://dev.w3.org/csswg/css3-text/#hyphens |
Версії CSS
| CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
|---|---|---|---|
Опис
Властивість hyphens дозволяє браузеру розставляти переноси слів у блоці тексту. Словник переносів зберігається в браузері та підключається лише при наявності атрибута lang з кодом мови. Так, для російської мови слід додати lang="ru" до тегу <html> або безпосередньо до абзацу тексту.
Синтаксис
hyphens: none | manual | auto
Значення
- none
- Слова не переносяться, навіть при наявності у тексті м'яких переносів ­.
- manual
- Переноси слів у тексті відбуваються там, де додано ­ або <wbr>; якщо їх немає, то переноси не виконуються.
- auto
- Браузер автоматично додає переноси слів на основі вбудованого словника переносів.
Приклад
HTML5CSS3IECrOpSaFx
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>hyphens</title>
<style>
p {
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
}
</style>
</head>
<body>
<p>Никотинамидадениндинуклеотидфосфат — широко
поширений в природі кофермент деяких
дегідрогеназ — ферментів, каталізуючих
окислювально-відновні реакції в
живих клітинах. </p>
</body>
</html>Результат прикладу в браузері Internet Explorer показаний на рис. 1.
Рис. 1. Переноси слів
Об'єктна модель
[window.]document.getElementById("elementID").style.hyphens
Браузери
Internet Explorer підтримує властивість -ms-hyphens.
Chrome, Safari, Android та iOS підтримують властивість -webkit-hyphens.
Firefox підтримує властивість -moz-hyphens.
Chrome не підтримує значення auto, тому переноси слів в ньому не працюють.