Ukázali jsme si, jak změnit barvu pozadí a barvu textu.
Ale s textem můžeme v CSS dokázat mnohem víc.
Pro začátek zkusíme změnit font.
Co je to font? Nejspíš už nějaký font znáte, ale zatím jste možná neslyšeli,
jak se mu říká.
Font je styl písma, tedy písmenek, ze kterých se skládají slova.
Někdy písmenka mohou mít kudrlinky, jindy jsou tlustá,
a někdy vypadají, jako by je někdo napsal psacím perem.
Bude jednodušší, když si rovnou ukážeme, jak takový font změnit.
Půjdu do CSS pravidla , které vybírá všechny odstavce,
a přidám vlastnost 'font-family'.
font-family sans pomlčka serif.
Viděli jste, jak se písmenka změnila?
Vypadají teď jednodušší.
Teď zkusím vrátit hodnotu 'font-family' zpátky na 'serif'.
Všímáte si, že písmenka vypadají teď o něco složitější?
'serif', neboli patkový font, má u písmenek takové malé nožičky - patky.
Když takto řekneme prohlížeči, aby použil 'serif' font, použije základní
patkové písmo v počítači. Což je většinou font 'Times New Roman'.
Mně se spíš ale líbí 'sans-serif', tak ho tam teď vrátím.
Slovo 'sans' pochází z latiny a znamená 'bez'.
Takže font sans-serif je ten, který je bez patek u písmenek.
A proto u něj písmena vypadají jednodušší.
Když řekneme prohlížeči, aby použil font 'sans-serif',
použije základní bezpatkový font v počítači, což je obvykle 'Arial' nebo 'Helvetica'.
Ale to nejdůležitější: prohlížeč vybere základní font počítače,
na kterém je návštěvník stránky, nikoliv autor.
Takže právě teď možná každý vidíme trochu jiný bezpatkový font,
Pokud váš počítač má jiný základní font než můj.
Někdy to je v pořádku, ale jindy bychom chtěli,
aby návštěvníci viděli přesně stejný font jako my.
V takovém případě můžu uvést přesný název fontu, například Helvetica.
A to bude fungovat pouze tehdy, pokud já i vy máme font Helvetica na našem počítači.
Ale ne všechny počítače mají všechny fonty k dispozici,
a v takovém případě prohlížeč bude tuto vlastnost úplně ignorovat.
Naštěstí, v CSS můžeme uvést záložní font pro případ,
kdy původní font na počítači neexistuje.
Stačí za 'Helvetica' přidat čárku a znovu uvést 'sans-serif'.
Teď když počítač nenajde Helveticu, prostě použije základní 'sans-serif',
neboli bezpatkový font.
Obecně kdykoliv použijeme název konkrétního fontu, jako je Helvetica,
tak bychom měli uvést i záložní rodinu fontů.
Kromě 'serif' a 'sans-serif' fontů je tu ještě několik rodin fontů,
které můžeme použít.
Kdybychom chtěli, aby text naší písničky vypadal jako napsaný rukou, použijeme 'font-family: cursive'.
Kdybychom chtěli použít něco extra, můžeme vyzkoušet rodinu fontů 'fantasy'.
Nebo pokud chceme, aby text vypadal jako napsaný na psacím stroji,
můžeme použít rodinu fontů 'monospace'.
Fonty 'monospace' mají pevnou šířku, což znamená,
že všechna písmena jsou přesně stejně široká.
A ve skutečnosti jsme se už s nimi tady na Khan Academy potkali,
protože ve všech editorech kódu tyto 'monospace' fonty používáme.
Chceme totiž, aby byl kód hezky zarovnaný bez ohledu na to, jaká
písmena přesně použijeme.
Teď, když už umíte změnit font, používejte tuto schopnost rozvážně.
Pokud chcete, aby vaše stránka vypadala dobře, omezte se jen na pár fontů,
a vyberte takové, které jdou dobře k sobě.
Pokud ale chcete mít ošklivou stránku, nikdo vám v tom nemůže zabránit. :-)