CSS Pseudo-clase. Pseudo-clase și clase CSS. ​​​​​​​Hover pe div. Simple Tooltip Hover.

Pseudo-clase și clase CSS

Pseudo-clasele pot fi combinate cu clase CSS:

Când treceți peste linkul din exemplu, acesta își va schimba culoarea:

Exemplu:

a.highlight:hover {
  color: #ff0000;
}

Hover pe <div>

Un exemplu de utilizare a pseudo-clasei „hover” pe un element <div>:

Exemplu:

div:hover {
  background-color: blue;
}

Simple Tooltip Hover

Hover peste un element <div> pentru a afișa un element <p> (cum ar fi un tooltip):

Exemplu:

p {
  display: none;
  background-color: yellow;
  padding: 20px;
}

div:hover p {
  display: block;
}