Die Pseudo-klas focus-within
Die pseudo-klas focus-within pas 'n styl toe
op elemente wat in fokus is.
In teenstelling met die pseudo-klas focus, wat die
style direk op die element self toepas, pas focus-within
'n styl toe op die ouerelement.
Sintaksis
selektor:focus-within {
}
Voorbeeld
Laat ons 'n ligblou agtergrondkleur toeken aan die ouerelement wanneer sy kindelement (invoerveld) in fokus is:
<div>
Gee asseblief u naam: <input name="user">
</div>
div {
width: 300px;
height: 50px;
padding: 10px;
}
div:focus-within {
background-color: #C2DDFD;
}
:
Sien ook
-
die pseudo-klas
:indeterminate,
wat 'n styl toepas op skakelaars wat in 'n onbepaalde toestand is -
die pseudo-klas
:default,
wat 'n styl toepas op standaard elemente -
die pseudo-klas
:fullscreen,
wat 'n styl toepas op elemente in volskermmodus -
die pseudo-klas
:placeholder-shown,
wat 'n styl toepas op elemente wanneer plekhouerteks vertoon word -
die eienskap
caret-color,
wat die kleur van die tekswyser in 'n invoerveld bepaal
