-
Lubię muzea, ale nie mam
czasu chodzić tam co dzień.
-
Na szczęście piękne obrazy
mogę znaleźć w Internecie.
-
Także w Khan Academy,
w sekcji historii sztuki.
-
Zrobiłam stronę z listami
słynnych obrazów,
-
z nagłówkiem i listami dla każdego stylu
oraz z linkami do artykułów o obrazach.
-
Żeby strona była bardziej elegancka,
artystyczna,
-
Za pomocą reguł CSS zmieniłam
czcionkę nagłówków - „h1” i „h2”.
-
Podoba mi się „cursive”, ale „fantasy”
będzie lepsza, więc to zmienię.
-
Och, i tutaj też zmienię,
bo są dwie reguły.
-
Życzę sobie, żeby wszystkie nagłówki
korzystały z jednej rodziny czcionek.
-
Nie chcę za każdym razem
zmieniać czcionki w dwóch miejscach.
-
Jak to rozwiązać?
Z dwu reguł CSS zrobić jedną.
-
Zastanówcie się chwilę.
-
Zaproponujecie, by dodać tę samą
klasę do „h1” i „h2”?
-
To by się udało i mielibyśmy
jedną regułę CSS dla tej klasy.
-
Utrudnilibyśmy sobie jednak życie,
-
bo musielibyśmy dodawać tę klasę
do każdego nowego „h1” i „h2”.
-
Jest lepszy sposób. Pogrupujemy
selektory, używając przecinków.
-
Dodamy przecinek po „h1”
i napiszemy „h2”.
-
Możemy skasować drugą regułę,
bo wcieliliśmy ją w pierwszą.
-
I już! Strona wygląda tak samo.
-
Teraz mogę eksperymentować z rodziną
czcionek, robiąc zmianę w 1 miejscu.
-
Zmieniam krój na „cursive”
- i zmieniły się wszystkie nagłówki!
-
Uważajcie na przecinek. Selektory
oddzielamy przecinkiem, nie spacją.
-
Spacji używamy do selektorów potomnych,
a to jest coś zupełnie innego.
-
Grupowanie jest świetne
do eliminowania powtórzeń.
-
Ale nie grupujcie dwóch selektorów tylko
dlatego, że mają te same właściwości.
-
Grupujcie je, gdy chcecie, żeby zawsze
miały te same właściwości.
-
Zwykle dlatego,
że są sobie bliskie znaczeniowo.
-
Tu selektor dotyczy wszystkich nagłówków,
bo chcę je zrobić w jednym stylu.
-
Poznacie jeszcze jedno częste
zastosowanie grupowania selektorów.
