Grouping selectors

/* applies to all these elements */

h1, h2, .class, #id { ... }
section h1, h2 { ... }

/* expands to  */

section h1 { ... }
h2 { ... }

Combining Selectors

/* only applies when "facny" and "intro" classes are included */

.fancy.intro {
...
}

<p class = "fancy intro"> Fancy intro paragraph </p>

/* only applies to <p> element with .intro class */

p.intro {
...
}

<p class = "intro">Intro paragraph </p>

Previous
Next