specificity of css selectors cheat sheet code example

Example: css selectors cheat sheet

.class {
  /* Selects all elements with class = "class" */
}

#id {
  /* Selects all elements with id = "class" */
}

p {
  /* Selects all p elements */
}

p.class {
  /* Selects all p elements with class = "class" */
}

h1, p {
  /* Selects all h1 elements and p elements */
}

h1 p {
    /* Selects all p elements inside h1 elements */
}

h1 > p {
    /* Selects all p elements whose parent is a h1 element */
}

h1 + p {
    /* Selects all p elements immediately after h1 elements */
}

h1 ~ p {
    /* Selects every p element preceded by a h1 element */
}

Tags:

Css Example