Selects all the spans that are directly inside div. It will not select a span inside a span.
div>span{
...
}
Selects all the p's that are directly after the h2. It will not select any p before h2.
h2 ~ p{
...
}
Selects only the p's that are directly after the h2. It will not select any p that comes after the p that is next to h2.
h2 + p{
...
}
Select all input type = text
input[type="text"]{
...
}
Select all input type = radio
input[type="radio"]{
...
}
Select all input type = checkbox
input[type="checkbox"]{
...
}
Selects any unordered list that has a class on it
ol[class]{
...
}
Selects any unordered list that has data attribute on it
ol[role="list"]{
...
}
Selects any button that has a class called "button" or "button-primary
[class|="button"]{
...
}