Selektory pseudoklas - CSS
Jedyne dziecko :only-child
Jak zmienić wygląd elementu dziecka, który nie ma braci?
(CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome)
- Dowolny rodzic:
dziecko:only-child { cecha: wartość } - Określony rodzic:
rodzic > dziecko:only-child { cecha: wartość }
Rodzicem oraz dzieckiem może być praktycznie dowolny znacznik, przy czym dziecko zawiera się w znaczniku rodzica [zobacz: Wstawianie stylów].
Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach.
Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach.
Polecenie pozwala nadać określone atrybuty formatowania dla elementu, który jest dzieckiem innego elementu - o jeden rząd niżej w hierarchii drzewa dokumentu, ale tylko jeśli rodzic nie ma już innych dzieci.
Przykład :only-child
Po wpisaniu w arkuszu stylów:b:only-child { color: red }otrzymamy na stronie:
To jest akapit, wewnątrz którego znajduje się pogrubienie (powinno być czerwone). Ten akapit ma tylko jedno dziecko.
Dla porównania to jest akapit, wewnątrz którego znajduje się pierwsze pogrubienie (nie powinno być czerwone) oraz drugie pogrubienie (również nie powinno być czerwone). Ten akapit ma więcej niż jedno dziecko.