CSS ::first-line Selector

The ::first-line selector in CSS is used to apply style to the first line of a block-level element. The length of the first line depends on many factors, including the width of the element, the width of the document, font-size of the text, etc.

Syntax:

::first-line {
    //CSS Property
}

Example:

html

<!DOCTYPE html> 

<html> 

<head> 

    <title> 

        CSS ::first-line selector 

    </title> 

    <style> 

        p { 

            width: 25%; 

        } 

        p::first-line { 

            color: white; 

            background: green; 

        } 

    </style> 

</head> 

<body style="text-align: center;"> 

    <h1 style="color:green;"> 

            GeeksforGeeks 

        </h1> 

    <h2> 

            CSS ::first-line selector 

        </h2> 

    <p> 

        A computer science portal for geeks. 

    </p> 

</body> 

</html>

Output:

Supported Browsers: The browser supported by ::first-line selector are listed below:

Apple Safari 1.0
Google Chrome 1.0
Edge 12.0
Firefox 1.0
Opera 7.0

Article Tags :

CSS

Web Technologies

CSS-Selectors