Psewdoklass focus-within

Psewdoklass focus-within fokusda ýerleşýän elementler üçin stili kesgitleýär. Derwezän özüne stili kesgitleýän psewdoklass focus-den tapawutlylykda, focus-within ata-element üçin stili kesgitleýär.

Sintaksis

selektor:focus-within {

}

Mysal

Onuň çagasy input elementi fokusda bolanda, ata-elementiň fonunyň reňkini gök reňke kesgitläýli:

<div>
	Adyňyzy giriziň: <input name="user">
</div>

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

Şeýle-de garap görüň

:indeterminate psewdoklassy,
ýagdaýy anyklanmadyk aýlawyjylar üçin stili kesgitleýär
:default psewdoklassy,
ädip görnüşdäki elementler üçin stili kesgitleýär
:fullscreen psewdoklassy,
doly ekran režimindäki elementler üçin stili kesgitleýär
:placeholder-shown psewdoklassy,
görkezmä teksti görkezilende elementler üçin stili kesgitleýär
caret-color aýratynlygy,
inputdaky tekst kursorunyň reňkini kesgitleýär