Псевдокласси focus-within
Псевдокласси focus-within услубро барои
элементҳое, ки дар фокуси ҳастанд, таъйин мекунад.
Ба фарқи псевдокласси focus, ки услубро ба
худ элемент таъйин мекунад, focus-within
услубро барои элементи волидайн таъйин мекунад.
Синтаксис
интихобкунанда:focus-within {
}
Намуна
Биёед ранги заминаи элементи волидайнро кабуд кунем, вақте ки фарзанди элемент инпут дар фокуси аст:
<div>
Номи худро ворид кунед: <input name="user">
</div>
div {
width: 300px;
height: 50px;
padding: 10px;
}
div:focus-within {
background-color: #C2DDFD;
}
:
Ҳамчунин бубинед
-
псевдокласси
:indeterminate,
ки услубро барои тугмаҳои гузариши ҳолати номуайян таъйин мекунад -
псевдокласси
:default,
ки услубро барои элементҳои пешфарз таъйин мекунад -
псевдокласси
:fullscreen,
ки услубро барои элементҳо дар реҷаи пурраэкранӣ таъйин мекунад -
псевдокласси
:placeholder-shown,
ки услубро барои элементҳо ҳангоми намоиши матни роҳнамо таъйин мекунад -
хосияти
caret-color,
ки ранги курсори матниро дар инпут таъйин мекунад