• lowercase – переводит все символы в нижний регистр.
Сделаем заглавие первого уровня как в английском языке: все слова запишем с прописной буквы (рис. 8.13):
h1 {
text-transform: capitalize;
}
Рис. 8.13. Изменение регистра букв
Вы можете использовать это свойство вместе со свойством letter-spacing, описанным выше. Вместе они дают интересный оформительский эффект. Текст, выделенный этими свойствами, может не отличаться по цвету от основного текста, не нарушая тем самым цветовую схему документа. И в то же время он будет сильно бросаться в глаза.
Поэкспериментируйте с заданием разных значений данного свойства для нашего примера, попробуйте сделать весь текст заголовка написанным сначала прописными буквами, а потом строчными.
Пустое место
CSS также позволяет задавать способ обработки браузером пустого пространства. Для этого нужно использовать свойство white-space. Рассмотрим значения, которые может принимать это свойство, и их описание:
• normal – браузер будет сжимать последовательно пустое пространство и разбивать строки для вмещения линейных блоков;
• pre – браузер не может изменять последовательность символов пустого пространства, строки разбиваются только в местах начала новой строки, обозначенных в исходном тексте;
• nowrap – работает, как значение normal в смысле сокращения пустого пространства, но запрещает образовывать разрывы строк в тексте, за исключением разрывов, определенных с помощью элемента BR.
Рассмотрим такой пример:
body { white-space: pre }
Браузер отобразит HTML-документ так, как он отображается в исходном виде, например в программе Блокнот.
Направление вывода текста
Направлением вывода текста можно управлять, используя CSS-свойство direction. Оно может принимать следующие значения:
• ltr – направление слева направо;
• rtl – направление справа налево.
Резюме
В данной главе мы разобрали основные методы форматирования текста средствами CSS. Вы познакомились с приемами изменения внешнего вида текста, заданием его шрифта, цвета, размера, научились изменять его внешний вид и располагать на странице.
Теперь вам под силу отформатировать текст любой сложности и любых размеров. Немного практики – и вы станете настоящим профессионалом веб-дизайна.
Глава 9
Оформление HTML-документа средствами CSS
9.1. Фон
9.2. Генерируемое содержимое
9.3. Автоматическая нумерация и списки
9.4. Таблицы
9.5. Интерфейс пользователя
9.6. Поля и отступы
9.7. Границы
9.8. Работа с блоками
В этой главе мы рассмотрим все возможности CSS по оформлению документа. Изучив этот материал, вы с легкостью сможете придать вашим страницам эксклюзивный вид. Начнем изучение с изменения фона страницы.
9.1. Фон
В качестве фона любого элемента страницы вы можете задать либо цвет, либо изображение. Свойства фона не наследуются, но фон родительского блока всегда будет виден, так как в качестве начального значения свойства background-color выступает значение transparent, то есть прозрачность.
Следует отметить, что некоторые браузеры будут отображать фон HTML-документов, заданный для элемента HTML. Хотя рекомендуется устанавливать фон для элемента BODY, а не для элемента HTML.