Pseudo-elements can be combined with CSS classes. This example will display the first letter of paragraphs with class="intro", in red and in a larger size:
HTML file: | Displayed by browser: |
---|---|
<style>
p.intro::first-letter { color: #ff0000; font-size:200%; } </style> <body> <p class="intro">This is an introduction.</p> <p>This is a paragraph with some text but no "intro" class is added to it.</p> </body> |
This is an introduction. This is a paragraph with some text but no "intro" class is added to it. |