English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS Reference Manual

CSS @rules (RULES)

Complete List of CSS Properties

CSS :first-line pseudo-element

Complete CSS Selector Reference Manual

Online Example

The style selected for the first line of each <p> element:

!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>Basic Tutorial(oldtoolbag.com)</title>
<style>
p:first-line
{
    background-color:orange;
}
</style>
</head>
<body>
<h1>Jiangnan Sizhu</h1>
<p> Jiangnan Sizhu, once known as "Suhnan Sizhu", "Wuyue Sizhu", and other names due to regional and inherent randomness.20th century5Early 0s, during the East China folk music performance, several musicians concerned about this issue discussed the naming issue together, and everyone finally believed that the name "Jiangnan Sizhu" was more appropriate. And so it became a custom.
The true formation of Jiangnan Sizhu music was at the end of the Qing Dynasty. Generations of Sizhu experts and masters adapted and refined folk music and ancient music, gradually forming its unique characteristics. Its rise and prosperity were during the Republic of China period, more than a hundred years ago.</p>
</body>
</html>
Test and see ‹/›

Definition and Usage

:first-The line selector is used to specify the style of the first line of the selector.

Note::first-The line selector can use the following properties: 

  • font properties

  • color properties 

  • background properties

  • word-spacing

  • letter-spacing

  • text-decoration

  • vertical-align

  • text-transform

  • line-height

  • clear

Note: "first-The line" selector is applicable to block-level elements.

Browser Compatibility

The numbers in the table indicate the first browser version that supports the attribute.

selectors




::first-line1.09.0
Part of5.5
1.01.07.0
Part of3.5

Related Articles

CSS Tutorial: CSS Pseudo-elements

Complete CSS Selector Reference Manual