Заглавные и строчные буквы в CSS
Одной из приятных особенностей CSS является возможность преобразовывать заглавные и строчные
буквы друг в друга, учитывая для этого местоположение буквы в слове. На этом можно построить
несколько оформительских приемов.
Все заглавные
Иногда бывает удобно преобразовать все буквы, независимо от их исходного регистра или
положения в слове к верхнему регистру. Для этого необходимо использовать свойство
text-transform. со значением
«uppercase». В следующем примере приведено правило, преобразующее текст всех
заголовков первого уровня (тег h1) к верхнему регистру:
h1 {text-transform:uppercase;}
Используя этот прием необходимо помнить, что большие куски текста, набранные исключительно
заглавными буквами - трудно читаемы. Если все же возникает такая потребность - лучше
использовать капитель.
Первая заглавная буква
В некоторых случаях необходимо преобразовать первую букву слова в заглавную, не затрагивая
остальных. Данный прием может применяться, например, для обработки отдельных фраз или для
выделения терминов. Следующий пример определяет класс для работы с терминами, у которых
автоматически первая буква преобразуется к верхнему регистру:
.term {text-transform:capitalize;}
Так же как при преобразовании всего текста к верхнему регистру, здесь так же необходимо
соблюдать меру. Одно слово, начинающееся с заглавной буквы, дает ощущение хорошего вкуса,
несколько таких слов идущих подряд - только ощущение сарказма автора.
Капитель
Капитель - достаточно простой в использовании метод, использовавшийся еще в
докомпьютерной типографике. Достаточно установить свойство
font-variant в значение
«small-caps». После этого браузер заменит строчные буквы на уменьшенные
копии заглавных. Следующий пример, используя псевдоэлемент
:first-line, оформляет
первую строку каждого параграфа капителью:
p:first-line {font-variant:small-caps;}
Такой текст читается гораздо лучше текста, состоящего из одних заглавных букв. Тем не
менее, не рекомендуется оформлять капителью большие объемы текста.