First-line selector in CSS3

How to add style to the first-line of the specified element in CSS3?

By using first-lineselector we can add the style to the first line of the specified element.

<style>
        p::first-line {
        color:blue;
        background-color:orange;
        font-size:20px;
        }
</style>

<body>
    <p>Mr. Sheo Narayan is a software professional since 2000 (15+ years) and working in .NET Technologies since 
        its first release. He is also the founder of a popular .NET Community website http://www.DotNetFunda.com.
        He has been awarded with Microsoft® Most Valuable Professional (MVP), Star Entrepreneur Award etc. 
        He has served thousands of professionals worldwide in solving their technical problems and teaching them in their professional careers. 
        His corporate training clients includes many MNCs.</p>
</body>

In the above code snippet, we have given style to the first-line of<p> element, so that in the output the first-line of <p> element appears with differnt colour, background-colour and size as per the given input.

OUTPUT

Views: 3240 | Post Order: 20

CSS3 > Selectors

First-line selector in CSS3

How to add style to the first-line of the specified element in CSS3?

Related Posts

Utility Tools