Breaking News

CSS GROUPING SELECTORS

A CSS Grouping Selector lets you apply the same CSS styles to multiple elements by separating the selectors with commas (,). This avoids repeating the same code.

Syntax

selector1, selector2, selector3 {
    property: value;
}

Example

h1, h2, p {
    color: blue;
    font-family: Arial, sans-serif;
}

In this example:

  • All <h1> elements will have blue text.
  • All <h2> elements will have blue text.
  • All <p> elements will also have blue text.
  • All three will use the Arial font.

HTML Example

<h1>Welcome</h1>
<h2>About Us</h2>
<p>This is a paragraph.</p>

Benefits

  • Reduces repetitive CSS code.
  • Makes stylesheets cleaner and easier to maintain.
  • Ensures consistent styling across multiple elements.

Output: The <h1>, <h2>, and <p> elements will all display with blue text and use the Arial font.

No comments