initial-letter – свойство, которое работает в паре с псевдоэлементом ::first-letter для большего контроля над стилизацией первой буквы.

Допустим, у нас есть такой параграф:

И мы хотим стилизовать его первую букву. Сперва зададим ширину параграфу, чтобы текст шел в несколько строчек:

Это изображение имеет пустой атрибут alt; его имя файла - image-4.png

Далее возьмем под контроль первую букву с помощью псевдоэлемента ::firts-letter, и применим к нему свойство initial-letter, где первая цифра будет отвечать за высоту буквы, которая равна количеству строк, а второе значение отвечает за то, сколько будет занимать строк первая буква.

Т.е. в нашем случае первая буква будет иметь высоту трех строк, и занимать место двух строк. Все просто:)

Данное свойство поддерживают еще не все браузеры, но думаю со временем это свойство станет стандартом в CSS.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *