Which element is used to add special style to the first letter of the text in a selector with CSS


Use the :first-letter element to add special effects to the first letter of elements in the document. You can try to run the following code to add special styles to the first letter of text −

Example

Live Demo

<html>
   <head>
      <style>
         p:first-letter {
            font-size: 5em;
         }
         p.normal:first-letter {
            font-size: 10px;
         }
      </style>
   </head>
   <body>
      <p class="normal"> First character of this paragraph will be normal and will have font size 10 px;</p>
      <p>The first character of this paragraph will be 5em big as defined in the CSS rule above. Rest of the characters in this paragraph will remain normal. This example shows how to use :first-letter pseduo element to give effect to the first characters of any HTML element.</p>
   </body>
</html>

Updated on: 13-Mar-2020

50 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements