Some Advanced Topic of CSS- CSS Selectors

There are some advanced topics in CSS. By knowing them we can write our CSS more efficiently. It will directly boost you up with your skills and level. Today we are going to explain about 3 topics.

• CSS Pseudo-Classes**

• CSS Pseudo-Elements**

CSS Pseudo-Classes: The pseudo-class selector is used to select the element that is in a specific state. By using this we can change the state by changing the styles.
The most commonly used Pseudo Classes are active, hover, etc.

Syntax:

selector: pseudo-class {
        property: value;
    }

In the Pseudo class, a colon (:) is used after the selector.

Example:

CSS Pseudo-Element: The pseudo-elements selector has particularly used in styling specific parts of an element. By using this we can change the state of a specific part by changing the styles.
The most commonly used Pseudo Elements are before, after, etc.

Syntax:

selector:: before {
        property: value;
    }

In the Pseudo element, two colons (::) are used after the selector.

Example: