ГЛАВА 9. Параметры абзацев, списков и отображения
ГЛАВА 9. Параметры абзацев, списков и отображения
В предыдущей главе мы рассмотрели атрибуты стиля, предназначенные для задания параметров текста (шрифта, его размера, начертания, тени и пр.) и фона эле- ментов Web-страниц. Изучили новый элемент Web-страницы — встроенный контейнер — и выяснили, зачем он нужен. А также начали создавать представление для Web-страниц нашего первого Web-сайта и неплохо в этом преуспели.
В этой главе мы изучим атрибуты стиля, с помощью которых задают параметры абзацев. Абзацев в широком смысле этого слова — к которым относятся и заголовки, и списки, и теги адреса, и большие цитаты. В общем, блочных элементов, рассмотренных в главе 2 и предназначенных для структурирования текста.
Далее мы рассмотрим атрибуты стиля, задающие специфические параметры списков и их пунктов (параметры маркеров и нумерации).
Напоследок мы познакомимся с двумя очень специфичными атрибутами стиля, которые позволят нам задать отображение элемента Web-страницы (т. е. будет он блочным или встроенным) и сделать элемент невидимым. Эти атрибуты стиля применяются нечасто и только в совокупности с определенным поведением (см. часть III).
Параметры вывода текста
Начнем мы с атрибутов стиля, управляющих выводом текста в структурирующих текст блочных элементах. Их совсем мало. И все они применимы только к блочным элементам.
Атрибут стиля text-align задает горизонтальное выравнивание текста:
text-align: left|right|center|justify|inherit
Здесь доступны значения left (выравнивание по левому краю; обычное поведение Web-обозревателя), right (по правому краю), center (по центру) и justify (полное выравнивание).
Примеры:
P { text-align: justify } H1 { text-align: center }
Атрибут стиля text-indent задает отступ для "красной строки":
text-indent: <отступ "красной строки">
Здесь допускаются абсолютные и относительные (относительно ширины абзаца) величины отступа. По умолчанию отступ "красной строки" равен нулю. Отметим, что атрибут стиля text-indent не поддерживает значение inherit.
Пример:
P { text-indent: 5mm }
Вот теперь абзацы будут иметь "красную строку".
Больше книг — больше знаний!
Заберите 20% скидку на все книги Литрес с нашим промокодом
ПОЛУЧИТЬ СКИДКУДанный текст является ознакомительным фрагментом.