CSS Pseudo-Elements

Pseudo-elements in CSS are used when we need to style some part of an element. Here is the syntax of the pseudo-element in CSS:

selector::pseudoElement {declaration;}

Important: Note the double colons (::).

For example, to style the first letter of a paragraph, use the following CSS code:

p::first-letter {color: purple; font-weight: bold; font-size: 28px;}

Pseudo-elements represent a portion of an element's content that cannot be selected using standard CSS selectors. In CSS3, pseudo-elements are denoted by double colons (::).

List of pseudo-elements in CSS

Advantages of the pseudo-elements in CSS

Disadvantages of the pseudo-elements in CSS

CSS Online Test


« Previous Tutorial Next Tutorial »