white-space | Свойство CSS - Справочник CSS3 | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Воскресенье, 11.12.2016
Главная » Справочник CSS3 » Свойства текста


2D & 3D ТрансформацияСвойства контента
Свойства импортаСвойства углов
Свойства границСвойства анимации
ПсевдоклассыПсевдоэлементы
Свойства размераСвойства контура
Свойства переходаСвойства печати
Свойства тениСвойства отступов
Свойства текстаСвойства колонок
Свойства полейПозиционирование
Свойства интерфейсаТипы значений
Полезные статьиСвойства списка
Свойства шрифтаСвойства таблицы
Свойства фонаВендорные префиксы



Адаптивный сайт - aTmpl


white-space | Свойство CSS

Свойство white-space устанавливает положение пробелов и переносов.




Свойство white-space устанавливает положение пробелов,чтобы определить как браузер будет управлять множественным пробелами и символами перевода строки.В HTML существует тег <pre>InformationВнимание!Работа тега немного отличается от работы свойства.,весь контент помещенный во нутрь этого тега будет выводиться идентично тому,что размещён в тексте кода,в таком случае единичная строка текста будет сдвигать границы своего родительского элемента если в ней нет символа перевода строки.Свойство применимо ко всем элементам.Создано в версии CSS1 и проходит валидацию согласно версии CSS3.




Дополнительные значения применяемые к white-space


Значение
Описание
normalПеренос строк устанавливается браузером,это значение по умолчанию
preТекст отобразится с учетом всех пробелов и переносов строк ( аналогично тегу <pre>InformationВнимание!Работа тега немного отличается от работы свойства.)
nowrapАвтоматический перенос игнорируется,весь текст отображается одной строкой.Перенос строки можно сделать только тегом <br>
pre-wrapCтроки будут прерываться соответственно границ родительского элемента.Формирование текста в одну строку с расширением границ производится не будет,а множественные пробелы и переводы строк сохранятся.
pre-lineСимволы перевода строки будут разрешены при выводе в браузере,множественные пробелы между элементами будут сворачиваться в один.
inheritНаследует значение родителя

Свойство работает в браузерах




Пример применения свойства



<!DOCTYPE html>
<html lang="ru">
<head>
<title>Свойство white-space</title>
<style type="text/css">
<!--
p {
border: 20px double green;
color:yellow;
font-size:20px;
font-family:cursive;
white-space:normal;
}
-->
</style>
</head>
<body>
<center>
<p>Этому тексту не задан принудительный перенос,но если он не будет помещается в окне браузера то браузер сам определит где делать перенос,то же самое было бы если свойство не было указано вообще.</p>
</center>
</body>
</html>


Пример в действии




Поэкспериментируйте сами





Русские шрифты






Источник: http://www.w3.org/TR/CSS21/text.html#propdef-white-space
Категория: Свойства текста | Добавил: IZOTOP (24.05.2012) | Автор: Меренков Михаил E W
Просмотров: 532 | Теги: css, white-space, свойство, пример, style | Рейтинг: 0.0/0

Вопросов / Советов / Предложений - относящихся к материалу: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]