CodesCompiler
🔍
HTMLCSSJavaScriptPythonSQLPHPSEOPostsBooksKids About Contact 🚀 Get Started Free

CSS - Group Selectors

CSS - Group Selectors

Group Selectors in CSS

CSS group selector applies the same style to multiple elements at a time. The names of elements can be separated by commas. Group selector keepsCSSconcise and avoids redundancy.

Syntax

The syntax for the CSS group selector is as follows:

CSS CODE
#selector_1, .selector_2, selector_3 {

    /* property: value; */

    color: #04af2f

}

CSS Group Selectors Example

In this example, we have used the same style on all three elements using group selectors.

Preview

Group Selectors Example with Pseudo-classes

In this example, we have usedpseudo classeswith group selectors. CSS:activepseudo-class changes the textcolorof the link andbuttonon clicking while CSS:hoverpseudo-class changes thebackground-colorof thedivandpelement.

Preview