Pseudo-classes

A pseudo-class targets an element in a special state, written with a colon after the selector. They let you react to user actions or position in a list.

• :hover applies when the pointer is over an element
• :focus applies when an input is selected
• :nth-child(n) targets elements by their order

button:hover {
  background: #4263eb;
}
li:nth-child(odd) {
  background: #f1f3f5;
}