WEBVTT

00:00:00.526 --> 00:00:03.525
Za pomocą CSS możemy
zmieniać rozmiar tekstu.

00:00:03.666 --> 00:00:06.564
Już widzicie, patrząc
na nagłówki i akapity,

00:00:06.564 --> 00:00:09.357
że przeglądarka zapewnia,
domyślnie,

00:00:09.357 --> 00:00:12.248
różne style i wielkości
dla różnych elementów.

00:00:12.352 --> 00:00:13.643
To jest rozmiar tekstu,

00:00:13.643 --> 00:00:15.936
a nagłówki każdego poziomu
są większe.

00:00:16.102 --> 00:00:18.650
Czasami chcemy zmienić czcionkę.

00:00:18.857 --> 00:00:22.206
Korzystamy z własności
„font-size” (rozmiar czcionki).

00:00:22.419 --> 00:00:23.853
Na przykład:

00:00:23.853 --> 00:00:28.643
Co zrobić, by cały tekst
na stronie był trochę mniejszy?

00:00:28.948 --> 00:00:31.062
Idziemy do znacznika „style”

00:00:31.102 --> 00:00:34.590
i dodajemy regułę CSS
do znacznika „body”.

00:00:34.889 --> 00:00:39.247
Wewnątrz dołożymy własność
„font-size” (rozmiar czcionki).

00:00:39.477 --> 00:00:42.669
Jaka powinna być wartość?

00:00:42.959 --> 00:00:45.654
Jak mierzymy czcionki?

00:00:45.930 --> 00:00:47.954
To bardzo dobre pytanie.

00:00:47.954 --> 00:00:50.267
Jest co najmniej 10 jednostek,

00:00:50.267 --> 00:00:52.358
które obsługuje CSS
dla tej własności.

00:00:52.684 --> 00:00:55.674
Zacznijmy od jednostki,
którą znacie: od pikseli.

00:00:55.853 --> 00:00:58.623
Stosowaliśmy ją, decydując
o wielkości obrazów.

00:00:58.623 --> 00:01:00.993
Będziemy jej często używać w CSS.

00:01:01.286 --> 00:01:02.985
Spróbujmy 11 pikseli.

00:01:04.040 --> 00:01:06.145
Ha! Wszystko zmalało.

00:01:06.405 --> 00:01:08.510
Nawet nagłówki.

00:01:08.786 --> 00:01:11.172
Ale dlaczego?

00:01:11.363 --> 00:01:15.316
Nie powinny mieć tylu pikseli,
ile określiła wcześniej przeglądarka?

00:01:15.502 --> 00:01:16.288
Nie.

00:01:16.432 --> 00:01:21.954
Domyślny styl nagłówków
nie jest określany w pikselach.

00:01:21.962 --> 00:01:25.207
Tu używa się innej jednostki, „em”.

00:01:25.495 --> 00:01:27.450
To jednostka względna,

00:01:27.450 --> 00:01:31.695
uzależniająca wielkość nagłówka
od rozmiaru czcionki w treści.

00:01:32.099 --> 00:01:33.817
Pokażę, o co chodzi.

00:01:34.055 --> 00:01:36.439
Przejdźmy do reguły stylu „h2”

00:01:36.574 --> 00:01:38.904
i dodajmy własność „font-size”.

00:01:39.446 --> 00:01:44.489
Nie będę myśleć o wielkości 
w pikselach, tylko względnie.

00:01:44.701 --> 00:01:49.903
Jak, proporcjonalnie, większy
ma być nagłówek „h2” od tekstu?

00:01:50.173 --> 00:01:52.857
Może dwukrotnie?

00:01:53.305 --> 00:01:56.763
Napiszemy więc „2em”.

00:01:56.992 --> 00:02:00.171
Przeglądarka obliczyła

00:02:00.171 --> 00:02:01.608
rozmiar w pikselach.

00:02:01.810 --> 00:02:05.048
Wie, że czcionka tekstu
ma 11 pikseli.

00:02:05.048 --> 00:02:08.055
Zaznaczyliśmy, że „h2”
ma być dwukrotnie większe,

00:02:08.055 --> 00:02:11.574
więc teraz wszystkie „h2”
mają 22 piksele wysokości.

00:02:12.142 --> 00:02:16.576
Jeśli zmienimy rozmiar
czcionki tekstu do 12 pikseli,

00:02:16.576 --> 00:02:18.932
jak duże będą nagłówki „h2”?

00:02:19.267 --> 00:02:21.494
Zgadza się, 24 piksele.

00:02:21.868 --> 00:02:26.345
A jeśli zmienimy rozmiar
czcionki „h2” do 1,5 em?

00:02:26.760 --> 00:02:30.805
Teraz „h2” będzie miało
12 razy 1,5,

00:02:31.023 --> 00:02:32.666
czyli 18 pikseli.

00:02:33.273 --> 00:02:37.754
Możemy też określić rozmiar „h2”
w pikselach, jak dla „body”.

00:02:37.754 --> 00:02:39.521
Zadziała to tak samo.

00:02:39.634 --> 00:02:41.502
Róbcie, jak wam wygodniej.

00:02:41.502 --> 00:02:45.258
Jak wspomniałam,
są też inne jednostki

00:02:45.258 --> 00:02:46.922
oprócz pikseli i em.

00:02:47.224 --> 00:02:49.568
Te są najpopularniejsze,

00:02:49.568 --> 00:02:51.016
ale, by wiedzieć więcej,

00:02:51.016 --> 00:02:53.193
obejrzyjcie nasze materiały

00:02:53.193 --> 00:02:55.402
lub poszukajcie innych w sieci.

00:02:55.503 --> 00:02:58.883
Pora poszaleć z rozmiarem czcionki!