Основы CSS


Оформление CSS


Боксовая модель CSS


Расширенный CSS


Примеры CSS


Справка CSS


HTML-верстка: инструменты и приемы профессиональной front-end разработки

Псевдо-элемент CSS :first-letter

Перейти к справке CSS

<html>
<head>
<style type="text/css">
p:first-letter
{
color:#ff0000;
font-size:xx-large;
}
</style>
</head>

<body>
<p>Это параграф. Первая буква параграфа будет выведена увеличенным шрифтом (xx-large) и красного цвета (#ff0000).</p>
</body>
</html>


Описание и использование

Псевдо-элемент :first-letter добавляет стиль первому символу текста.

Заметка: можно изменить следующие характеристики текста с помощью :first-letter: 

Псевдо-элементы могут комбинироваться с классами CSS: 

p.article:first-letter {color:#ff0000}

<p class="article">Это параграф.</p>

В приведенном примере первая буква всех параграфов с классом "article" будет окрашена в красный цвет


Поддержка в браузерах

Chrome Firefox Internet Explorer Opera Safari
Псевдо-элемент :first-letter поддерживается всеми основными браузерами.


Связанные страницы

Учебник CSS: Псевдо-элементы в CSS


Перейти к справке CSS


СТАТИСТИКА



ССЫЛКИ


Подпишись на новости сайта