Псевдокласси focus-within

Псевдокласси focus-within услубро барои элементҳое, ки дар фокуси ҳастанд, таъйин мекунад. Ба фарқи псевдокласси focus, ки услубро ба худ элемент таъйин мекунад, focus-within услубро барои элементи волидайн таъйин мекунад.

Синтаксис

cssинтихобкунанда:focus-within {

}

Намуна

Биёед ранги заминаи элементи волидайнро кабуд кунем, вақте ки фарзанди элемент инпут дар фокуси аст:

html<div>
  Номи худро ворид кунед: <input name="user">
</div>

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

Результат:

Ҳамчунин бубинед