Псевдоэлемент ::first-line | Справочник CSS
http://belarusweb.net
Основы создания сайтов

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

Описание

Псевдоэлемент ::first-line (от англ. first lineпервая строка) позволяет выбрать первые строки блочных элементов требуемого типа, которые отсчитываются от начала текста до принудительного либо автоматического перевода текста на новую строку. При этом ширина строки может меняться в зависимости от ширины блочного элемента, но стиль первой строки будет оставаться постоянным вплоть до перевода на новую строку. К псевдоэлементу могут применяться только свойства, относящиеся к шрифтам, тексту, цвету и фону, хотя в зависимости от браузера могут применяться и некоторые другие свойства. Например, если задано правило p::first-line {блок объявлений}, то данный стиль будет применен ко всем первым строкам абзацев.

Селекторы псевдоэлементов выбирают элементы требуемого типа, явно не указанные в дереве элементов html-документа и соответствующие требованиям указанного в селекторе псевдоэлемента, который отделяется от элемента двумя двоеточиями '::'.

Синтаксис

<селектор>::first-line {блок объявлений}

Ссылки

Примеры

HTML Результат BwCodes
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
	
		div::first-letter{
		color: red;			 
		}
		
		p::first-line{
		color: blue;			 
		}
		
	</style>
	
</head>
<body>

	<div>
		Первая буква блока будет красной.<br>
		Весь остальной текст будет обычным.
	</div>
	
	<p>
		А у меня будет синей вся первая строка.<br>
		А я не синяя, т.к. вторая.
	</p>
	
</body>
</html>

Пример №1