Psevdo-sinif focus-within

Psevdo-sinif focus-within fokusda olan elementlər üçün stil təyin edir. Birbaşa özünə stil təyin edən focus psevdo-sinifindən fərqli olaraq, focus-within valideyn element üçün stil təyin edir.

Sintaksis

cssselektor:focus-within {

}

Nümunə

Gəlin, valideyn elementin fon rəngini mavi edək, onun uşaq input elementi fokusda olduqda:

html<div>
  Adınızı daxil edin: <input name="user">
</div>

cssdiv {
  width: 300px;
  height: 50px;
  padding: 10px;
}
div:focus-within {
  background-color: #C2DDFD;
}

Результат:

Həmçinin bax