1
00:00:00,526 --> 00:00:03,525
Ми можемо використовувати CSS також
для того, щоб змінити розмір шрифту.

2
00:00:03,666 --> 00:00:07,414
Як ви можете побачити, порівнявши
заголовки цієї сторінки з абзацами,

3
00:00:07,434 --> 00:00:09,247
браузер за замовчуванням надає


4
00:00:09,247 --> 00:00:12,248
різним елементам стилів 
різні розміри.

5
00:00:12,352 --> 00:00:13,643
Існує розмір шрифту основного тексту

6
00:00:13,643 --> 00:00:15,936
і більші розміри для кожного
рівня заголовків.

7
00:00:16,102 --> 00:00:18,650
Однак інколи ми хочемо трохи
змінити ці розміри.

8
00:00:18,857 --> 00:00:22,206
І ми можемо це зробити за допомогою
властивості CSS "font-size" (розмір шрифту).

9
00:00:22,419 --> 00:00:23,853
Наприклад:

10
00:00:23,853 --> 00:00:28,643
Як зробити так, щоб весь шрифт 
на сторінці був трохи меншим?

11
00:00:28,948 --> 00:00:31,062
Що ж, ми перейдемо до тега 

12
00:00:31,102 --> 00:00:34,590
і додамо правило CSS до тега .

13
00:00:34,889 --> 00:00:39,247
І потім всередині додамо властивість
"font-size".

14
00:00:39,477 --> 00:00:42,669
Яким має бути значення 
для властивості "font-size"?

15
00:00:42,959 --> 00:00:45,654
Як ми вимірюємо розмір шрифту?

16
00:00:45,930 --> 00:00:47,954
Це насправді дуже добре запитання,

17
00:00:47,954 --> 00:00:50,267
тому що існує щонайменше 
10 різних одиниць виміру,

18
00:00:50,267 --> 00:00:52,358
які надає CSS для розміру шрифтів.

19
00:00:52,684 --> 00:00:55,674
Почнімо з одиниць, які ви
вже бачили раніше: пікселі.

20
00:00:55,853 --> 00:00:58,623
Ми використовували пікселі, щоб
змінити розмір наших зображень,

21
00:00:58,623 --> 00:01:00,993
і ми ще багато де будемо їх 
використовувати в CSS.

22
00:01:01,286 --> 00:01:02,985
Спробуймо 11 пікселів.

23
00:01:04,040 --> 00:01:06,145
Все стало меншим.

24
00:01:06,405 --> 00:01:08,510
Навіть заголовки зменшились.

25
00:01:08,786 --> 00:01:11,172
Чому заголовки також зменшились?

26
00:01:11,363 --> 00:01:15,316
Хіба б вони не мали бути такого розміру, 
який встановив для них браузер раніше?

27
00:01:15,502 --> 00:01:16,288
Ні.

28
00:01:16,432 --> 00:01:21,954
Тому що значення за замовчуванням 
для заголовків встановлене не в пікселях.

29
00:01:21,962 --> 00:01:25,207
Воно встановлене в інших одиницях
виміру: "em".

30
00:01:25,495 --> 00:01:27,450
І ця одиниця виміру є відносною,

31
00:01:27,450 --> 00:01:31,695
і тому змінює розмір шрифту заголовків
пропорційно до шрифту основного тексту.

32
00:01:32,099 --> 00:01:33,817
Дозвольте я вам покажу, 
що я маю на увазі.

33
00:01:34,055 --> 00:01:36,439
Перейдімо до правила стилю "h2"

34
00:01:36,574 --> 00:01:38,904
і додаймо властивість "font-size".

35
00:01:39,446 --> 00:01:44,489
Цього разу, замість того щоб вказати
значення в пікселях, я його задам відносно.

36
00:01:44,701 --> 00:01:49,903
Наскільки більшим має бути заголовок "h2",
в порівнянні з текстом основної частини?

37
00:01:50,173 --> 00:01:52,857
Можливо, вдвічі?

38
00:01:53,305 --> 00:01:56,763
Для цього ми напишемо "2em".

39
00:01:56,992 --> 00:02:00,171
Що зараз насправді робить браузер — 
це обчислює

40
00:02:00,171 --> 00:02:01,608
розмір шрифту в пікселях.

41
00:02:01,810 --> 00:02:05,048
Браузер знає, що розмір шрифту тексту 
був 11 пікселів,

42
00:02:05,048 --> 00:02:08,055
а ви сказали, що заголовок "h2"
має бути вдвічі більшим.

43
00:02:08,055 --> 00:02:11,574
Тому зараз усі заголовки "h2" 
мають 22 пікселі.

44
00:02:12,142 --> 00:02:16,576
Якщо ми змінимо розмір шрифту 
тексту на 12 пікселів,

45
00:02:16,576 --> 00:02:18,932
тоді яким буде розмір заголовків "h2"?

46
00:02:19,267 --> 00:02:21,494
Правильно, 24 пікселі.

47
00:02:21,868 --> 00:02:26,345
А якщо ми змінимо розмір шрифту 
заголовків на "1,5em"?

48
00:02:26,760 --> 00:02:30,805
Тепер заголовки будуть 
12 * 1,5,


49
00:02:31,023 --> 00:02:32,666
що дорівнює 18 пікселів.

50
00:02:33,273 --> 00:02:37,754
Ми можемо також визначити розмір пікселів
для заголовків, так само як ми це робили

51
00:02:37,754 --> 00:02:39,521
для тексту, і це працюватиме так само.

52
00:02:39,634 --> 00:02:41,502
Все залежить від того, як вам простіше.

53
00:02:41,502 --> 00:02:45,258
І як я вже казала раніше, існує багато
інших одиниць виміру, які ми можемо

54
00:02:45,258 --> 00:02:46,922
використовувати замість пікселів та "em".

55
00:02:47,224 --> 00:02:49,568
Пікселі та "em" — це просто найпоширеніші
одиниці виміру.

56
00:02:49,568 --> 00:02:51,016
Але якщо вам хочеться більшого,

57
00:02:51,016 --> 00:02:53,193
прогляньте документацію щодо
розміру шрифтів

58
00:02:53,193 --> 00:02:55,402
або пошукайте більше інформації
в Інтернеті.

59
00:02:55,503 --> 00:02:58,883
Настав час зробити чудовими розміри
ваших шрифтів!

60
00:02:58,911 --> 00:03:03,321
Переклад на українську мову: Зоряна Гаврилюк, рев'юер: Юлія Білаш, Благодійний фонд "magneticOne.org"