Open In App

CSS ::first-line Selector

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

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:

 firstline 

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 

Last Updated : 07 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads