создание и разработка веб-сайтов
поисковая оптимизация и реклама
статьи о программировании и веб-дизайне

Ссылки по теме:
 

Стиль text и форматирование текста

Здесь речь пойдет не только о стиле text и его свойствах, но и о некоторых других элементах каскадных таблиц стилей (CSS), которые позволяют управлять представлением текстовой информации на страницах Интернет-ресурса.


text-align

Позволяет задать выравнивание текстового блока в пределах его границ. Имеет несколько значений:
center – выравнивает текстовую информацию по центру,
justify – выравнивает текст по левой и правой границам текстового блока, расстояние между словами внутри строки в данном случае увеличивается для того, чтобы обеспечить такое выравнивание,
left – текст выравнивается по левому краю текстового блока (по умолчанию),
right – текст выравнивается по правому краю текстового блока.
Пример,
p {text-align:justify;}


text-decoration

Позволяет создавать несколько эффектов оформления текста на странице. В зависимости от значения, задаваемого данным свойством, текст может мигать (blink), перечеркиваться (line-through), подчеркиваться как снизу (underline), так и сверху (overline). По умолчанию свойство имеет значение none.
Пример,
a {text-decoration:underline;}
a:hover{text-decoration: none;}
При наведении стрелки мыши на подчеркнутую ссылку, подчеркивание убирается.

text-indent (часто ошибочно пишут text-ident)

Задает величину отступа первой строки в текстовом абзаце в различных единицах измерения, применимых к каскадным таблицам стилей CSS, или в процентах длины форматируемого элемента.
Пример,
p {text-indent: 15px;}

text-transform

Преобразование символов текста к одному из следующих видов:
capitalize – каждое слово текстового блока будет начинаться с заглавной буквы,
lowercase – все символы будут отображаться как строчные,
uppercase – все символы отображаются как прописные.


На этом варианты форматирования текста не заканчиваются, существуют также свойства, позволяющие управлять межсимвольными (letter-spacing), междустрочными (line-height) расстояниями, расстояниями между словами (word-spacing), отображением пробелов и переносов между словами (white-space: normal || nowrap || pre, автоматический перенос строк || весь текст отображается без переносов || с учетом пробелов и переносов, так же как в html-коде).

Примеры,

p { letter-spacing: 5px; word-spacing: 10em; } h1 { line-height: 60%; white-space:nowrap; } p { line-height: 1.5; }


31 декабря 2007 г.