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

first-line

Поддержка браузерами
Настольные браузеры Chrome Firefox Internet Explorer Opera Safari
Версии браузеров 1.0 1.0 9.0 7.0 1.0
Мобильные браузеры Android Firefox Mobile IE Phone Opera Mobile Safari Mobile
Базовая поддержка, версии браузеров 2.2 1.0 7.5 12 5.1
Псевдоэлемент
::first-line — этот псевдоэлемент позволяет задавать стили только к первой строке текста
Можно применять
Свойства: background | color | font | letter-spacing | line-height | text-decoration | text-transform | text-shadow | vertical-align | word-spacing
Правила записи
element::first-line { свойство: значение; }
Примеры
p::first-line{ background-color: crimson; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { color: gold; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { font-size: 2em; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { letter-spacing: 7px; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { line-height: 3em; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { text-decoration: underline; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { text-shadow: 0.2em 0.2em 0.3em red; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { vertical-align: middle; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

p::first-line { word-spacing: 2.5em; }

Для примера приведём просто набор букв дыфаодвалоп ыдвлаордлаорплаврплаплдрокушгнщку шнгукрдлаопрловалров алроалпралпрапраправр вадровадлродвалордва лорджвалорвларждвалрждвалор двалрождвалрждвалрж двалрждвлаожрдл вапржлваопрлваорп жлаоврплавжлрдповаровадорвадлровдал двалорждвалрдвлапждрвларпдлваоп

Поделиться