CSS3 > Selectors

First-letter selector in CSS3

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


By using first-letterselector we can add style to the first letter of the specified element.

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

 <body>
    <p>TechFunda.com</p>
    <p>DotNetFunda.com</p>
    <p>ItFunda.com</p>
    <p>KidsFunda.com</p>
</body>

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

OUTPUT

 Views: 577 | Post Order: 19



Write for us