1
00:00:00,211 --> 00:00:05,221
Ukázali jsme si, jak změnit
barvu pozadí a barvu textu.

2
00:00:05,303 --> 00:00:08,682
Ale s textem můžeme
v CSS dokázat mnohem víc.

3
00:00:09,509 --> 00:00:12,110
Pro začátek zkusíme změnit font.

4
00:00:12,110 --> 00:00:15,925
Co je to font? Nejspíš už nějaký font
znáte, ale zatím jste možná neslyšeli,

5
00:00:15,925 --> 00:00:17,243
jak se mu říká.

6
00:00:17,243 --> 00:00:19,802
Font je styl písma, tedy písmenek,
ze kterých se skládají slova.

7
00:00:19,802 --> 00:00:22,996
Někdy písmenka mohou mít 
kudrlinky, jindy jsou tlustá,

8
00:00:22,996 --> 00:00:25,884
a někdy vypadají, jako by je
někdo napsal psacím perem.

9
00:00:25,884 --> 00:00:30,266
Bude jednodušší, když si rovnou
ukážeme, jak takový font změnit.

10
00:00:30,663 --> 00:00:35,441
Půjdu do CSS pravidla ,
které vybírá všechny odstavce,

11
00:00:35,729 --> 00:00:38,623
a přidám vlastnost 'font-family'.

12
00:00:38,681 --> 00:00:41,621
font-family sans pomlčka serif.

13
00:00:41,739 --> 00:00:44,115
Viděli jste, jak se písmenka změnila?

14
00:00:44,115 --> 00:00:47,126
Vypadají teď jednodušší.

15
00:00:47,126 --> 00:00:52,183
Teď zkusím vrátit hodnotu
'font-family' zpátky na 'serif'.

16
00:00:52,283 --> 00:00:55,902
Všímáte si, že písmenka
vypadají teď o něco složitější?

17
00:00:55,902 --> 00:00:59,979
'serif', neboli patkový font, má u písmenek
takové malé nožičky - patky.

18
00:00:59,979 --> 00:01:04,269
Když takto řekneme prohlížeči, aby
použil 'serif' font, použije základní

19
00:01:04,269 --> 00:01:08,162
patkové písmo v počítači. Což je
většinou font 'Times New Roman'.

20
00:01:10,554 --> 00:01:13,114
Mně se spíš ale líbí 'sans-serif',
tak ho tam teď vrátím.

21
00:01:14,246 --> 00:01:17,806
Slovo 'sans' pochází z latiny
a znamená 'bez'.

22
00:01:17,996 --> 00:01:21,810
Takže font sans-serif je ten,
který je bez patek u písmenek.

23
00:01:21,810 --> 00:01:24,177
A proto u něj písmena vypadají jednodušší.

24
00:01:24,177 --> 00:01:27,936
Když řekneme prohlížeči,
aby použil font 'sans-serif',

25
00:01:27,936 --> 00:01:33,136
použije základní bezpatkový font v počítači,
což je obvykle 'Arial' nebo 'Helvetica'.

26
00:01:33,136 --> 00:01:37,710
Ale to nejdůležitější: prohlížeč
vybere základní font počítače,

27
00:01:37,710 --> 00:01:41,216
na kterém je návštěvník stránky, nikoliv autor.

28
00:01:41,553 --> 00:01:45,257
Takže právě teď možná každý vidíme
trochu jiný bezpatkový font,

29
00:01:45,317 --> 00:01:48,272
Pokud váš počítač má jiný
základní font než můj.

30
00:01:48,272 --> 00:01:51,969
Někdy to je v pořádku,
ale jindy bychom chtěli,

31
00:01:51,969 --> 00:01:56,263
aby návštěvníci viděli
přesně stejný font jako my.

32
00:01:56,701 --> 00:02:02,722
V takovém případě můžu uvést přesný
název fontu, například Helvetica.

33
00:02:03,150 --> 00:02:08,418
A to bude fungovat pouze tehdy, pokud
já i vy máme font Helvetica na našem počítači.

34
00:02:08,436 --> 00:02:12,641
Ale ne všechny počítače
mají všechny fonty k dispozici,

35
00:02:12,708 --> 00:02:14,746
a v takovém případě prohlížeč
bude tuto vlastnost úplně ignorovat.

36
00:02:14,746 --> 00:02:20,029
Naštěstí, v CSS můžeme
uvést záložní font pro případ,

37
00:02:20,058 --> 00:02:22,979
kdy původní font na počítači neexistuje.

38
00:02:22,979 --> 00:02:28,001
Stačí za 'Helvetica' přidat čárku
a znovu uvést 'sans-serif'.

39
00:02:28,443 --> 00:02:32,737
Teď když počítač nenajde Helveticu,
prostě použije základní 'sans-serif',

40
00:02:32,737 --> 00:02:35,070
neboli bezpatkový font.

41
00:02:35,070 --> 00:02:39,300
Obecně kdykoliv použijeme název
konkrétního fontu, jako je Helvetica,

42
00:02:39,324 --> 00:02:44,172
tak bychom měli uvést
i záložní rodinu fontů.

43
00:02:44,447 --> 00:02:48,349
Kromě 'serif' a 'sans-serif' fontů
je tu ještě několik rodin fontů,

44
00:02:48,349 --> 00:02:49,995
které můžeme použít.

45
00:02:49,995 --> 00:02:56,604
Kdybychom chtěli, aby text naší písničky vypadal
jako napsaný rukou, použijeme 'font-family: cursive'.

46
00:02:57,794 --> 00:03:03,874
Kdybychom chtěli použít něco extra, můžeme
vyzkoušet rodinu fontů 'fantasy'.

47
00:03:04,944 --> 00:03:08,305
Nebo pokud chceme, aby text
vypadal jako napsaný na psacím stroji,

48
00:03:08,305 --> 00:03:11,124
můžeme použít rodinu fontů 'monospace'.

49
00:03:11,204 --> 00:03:14,230
Fonty 'monospace' mají pevnou šířku,
což znamená,

50
00:03:14,230 --> 00:03:16,477
že všechna písmena jsou
přesně stejně široká.

51
00:03:16,477 --> 00:03:20,051
A ve skutečnosti jsme se už s nimi
tady na Khan Academy potkali,

52
00:03:20,258 --> 00:03:23,328
protože ve všech editorech kódu
tyto 'monospace' fonty používáme.

53
00:03:23,996 --> 00:03:27,077
Chceme totiž, aby byl kód hezky zarovnaný
bez ohledu na to, jaká

54
00:03:27,216 --> 00:03:29,381
písmena přesně použijeme.

55
00:03:29,480 --> 00:03:33,310
Teď, když už umíte změnit font,
používejte tuto schopnost rozvážně.

56
00:03:33,450 --> 00:03:37,790
Pokud chcete, aby vaše stránka vypadala
dobře, omezte se jen na pár fontů,

57
00:03:37,790 --> 00:03:40,910
a vyberte takové, které jdou dobře k sobě.

58
00:03:40,910 --> 00:03:45,617
Pokud ale chcete mít ošklivou stránku,
nikdo vám v tom nemůže zabránit. :-)