WEBVTT

00:00:00.665 --> 00:00:04.776
Lubię muzea, ale nie mam
czasu chodzić tam co dzień.

00:00:04.776 --> 00:00:07.987
Na szczęście piękne obrazy
mogę znaleźć w Internecie.

00:00:07.987 --> 00:00:11.278
Także w Khan Academy,
w sekcji historii sztuki.

00:00:11.278 --> 00:00:14.340
Zrobiłam stronę z listami
słynnych obrazów,

00:00:14.340 --> 00:00:21.318
z nagłówkiem i listami dla każdego stylu
oraz z linkami do artykułów o obrazach.

00:00:21.318 --> 00:00:25.164
Żeby strona była bardziej elegancka,
artystyczna,

00:00:25.164 --> 00:00:31.149
Za pomocą reguł CSS zmieniłam
czcionkę nagłówków - „h1” i „h2”.

00:00:31.149 --> 00:00:38.886
Podoba mi się „cursive”, ale „fantasy”
będzie lepsza, więc to zmienię.

00:00:38.886 --> 00:00:43.846
Och, i tutaj też zmienię,
bo są dwie reguły.

00:00:43.846 --> 00:00:49.262
Życzę sobie, żeby wszystkie nagłówki
korzystały z jednej rodziny czcionek.

00:00:49.262 --> 00:00:54.414
Nie chcę za każdym razem
zmieniać czcionki w dwóch miejscach.

00:00:54.414 --> 00:01:00.020
Jak to rozwiązać?
Z dwu reguł CSS zrobić jedną.

00:01:00.020 --> 00:01:04.038
Zastanówcie się chwilę.

00:01:04.038 --> 00:01:08.364
Zaproponujecie, by dodać tę samą
klasę do „h1” i „h2”?

00:01:08.364 --> 00:01:12.047
To by się udało i mielibyśmy
jedną regułę CSS dla tej klasy.

00:01:12.047 --> 00:01:14.828
Utrudnilibyśmy sobie jednak życie,

00:01:14.828 --> 00:01:19.119
bo musielibyśmy dodawać tę klasę
do każdego nowego „h1” i „h2”.

00:01:19.119 --> 00:01:25.495
Jest lepszy sposób. Pogrupujemy
selektory, używając przecinków.

00:01:25.495 --> 00:01:31.970
Dodamy przecinek po „h1”
i napiszemy „h2”.

00:01:31.970 --> 00:01:37.262
Możemy skasować drugą regułę,
bo wcieliliśmy ją w pierwszą.

00:01:37.262 --> 00:01:39.947
I już! Strona wygląda tak samo.

00:01:39.947 --> 00:01:44.272
Teraz mogę eksperymentować z rodziną
czcionek, robiąc zmianę w 1 miejscu.

00:01:44.272 --> 00:01:48.679
Zmieniam krój na „cursive”
- i zmieniły się wszystkie nagłówki!

00:01:48.679 --> 00:01:55.765
Uważajcie na przecinek. Selektory
oddzielamy przecinkiem, nie spacją.

00:01:55.765 --> 00:02:03.046
Spacji używamy do selektorów potomnych,
a to jest coś zupełnie innego.

00:02:03.046 --> 00:02:08.515
Grupowanie jest świetne
do eliminowania powtórzeń.

00:02:08.515 --> 00:02:14.345
Ale nie grupujcie dwóch selektorów tylko
dlatego, że mają te same właściwości.

00:02:14.345 --> 00:02:18.365
Grupujcie je, gdy chcecie, żeby zawsze
miały te same właściwości.

00:02:18.365 --> 00:02:21.887
Zwykle dlatego,
że są sobie bliskie znaczeniowo.

00:02:21.887 --> 00:02:28.262
Tu selektor dotyczy wszystkich nagłówków,
bo chcę je zrobić w jednym stylu.

00:02:28.262 --> 00:02:32.895
Poznacie jeszcze jedno częste
zastosowanie grupowania selektorów.