Languages
[Edit]
EN

CSS - style first letter only

0 points
Created by:
Kevin
367

In this article, we would like to show you how to style the first letter only using CSS.

Quick solution:

div::first-letter {
  color: red;
}

The ::first-letter CSS pseudo-element applies styles to the first letter of the first line of the specified element.

 

Practical example

In this example, we style the first letter inside the div element using the ::first-letter CSS pseudo-element.

// ONLINE-RUNNER:browser;

<!doctype html>
<html>
  <head>
    <style>
      
      div::first-letter {
        color: red;
        font-size: 150%;
        font-weight: bold;
      }

    </style>
  </head>
  <body>
    <div>Example text inside the div element.</div>
  </body>
</html>

References

Native Advertising
ūüöÄ
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

‚̧ԳŹūüíĽ ūüôā

Join