Pseudo-class Selectors

Used to define a special state of an element.

a:hover {
  color: red;
}

👉 When user hovers over a link

input:focus {
  border: 2px solid blue;
}


li:first-child {
  color: green;
}


li:last-child {
  color: blue;
}


li:nth-child(2) {
  color: red;
}