Focus-within psevdoklassi

focus-within psevdoklassi fokusda joylashgan elementlar uchun uslubni o'rnatadi. To'g'ridan-to'g'ri elementning o'ziga uslub o'rnatadigan focus psevdoklassidan farqli o'laroq, focus-within ota-element uchun uslubni o'rnatadi.

Sintaksis

cssselector:focus-within {

}

Misol

Keling, ota-elementning foniga ko'k rang bering, qachonki uning pastki elementi input fokusda bo'lsa:

html<div>
  Ismingizni kiriting: <input name="user">
</div>

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

Результат:

Shuningdek qarang