Обработка пробелов: white-space

white-space

Поддержка браузерами
Настольные браузеры Chrome Firefox Internet Explorer Opera Safari
Версии браузеров 1.0 3.5 8.0 9.5 3.0
Мобильные браузеры Android Firefox IE Phone Opera Mobile Safari Mobile
Версии браузеров 2 1.0.1 7.5 12 5.1
Свойство
white-space — это свойство позволяет обрабатывать символы пробела, перевода строки и табуляции в документе
Наследование
Наследуется. Это значит что стили применённые к родительскому элементу передадутся потомкам
Применяется
Ко всем элементам, это значит что применяется и к блочным, и к встроенным, и к табличным и т.д.
Может принимать значения
normal | pre | nowrap | pre-wrap | pre-line | inherit
Значение по умолчанию
normal
Правила записи
свойство: значение;
Примеры
white-space: normal; Применив это свойство со значением normal браузер вставит только один пробел между словами (даже если в разметке указано больше) и проигнорирует переносы строки (если они есть в разметке)
white-space: pre; Применив это свойство со значением pre браузер не будет игнорировать пробелы ,
пробелов
будет ровно столько
сколько указано в разметке, все переносы строк сохраняются, это поведение
полностью соответствует тегу
<pre>
white-space: nowrap; Применив это свойство со значением nowrap браузер запрещает переносить текст на другую строку
white-space: pre-wrap; Применив это свойство со значением pre-wrap браузер не будет игнорировать пробелы,
пробелов будет ровно столько сколько указано в разметке,
перенос текста на другую строку будет
осуществляться так как задано в разметке, кроме того если строка слишком длинная, то перенос строки будет осуществлён автоматически
white-space: pre-line; Применив это свойство со значением pre-line браузер вставит
только один пробел между словами (даже если в разметке указано больше), перенос текста на другую
строку будет осуществляться так как задано в разметке
white-space: inherit; Это значит что свойство унаследует значение от родителя
Поделиться