Vlastnost font-family

Vlastnost font-family nastavuje typ písma.

Syntaxe

selektor {
	font-family: název písma;
}

Poznámka

Pokud název písma obsahuje mezery, například Times New Roman, musí být uzavřen do jednoduchých nebo dvojitých uvozovek.

Poznámka

Lze vypsat několik podobných písem čárkou oddělených. Když prohlížeč narazí na první písmo v seznamu, zkontroluje jeho přítomnost na počítači uživatele. Pokud takové písmo není, bere se další písmo ze seznamu a také se analyzuje na přítomnost. Proto několik písem zvyšuje pravděpodobnost, že alespoň jedno z nich bude nalezeno na klientském počítači.

Seznam obvykle končí klíčovým slovem, které popisuje typ písma (všechna písma patří k nějakému typu) - serif, sans-serif, cursive, fantasy nebo monospace. Pokud prohlížeč nenašel žádné z uvedených písem na počítači uživatele, pak vybere jedno z písem uvedeného typu.

Typy písem

Typ	Popis
`serif`	Písmo s patkami.
`sans-serif`	Písmo bez patěk.
`cursive`	Kurzívní písmo.
`fantasy`	Dekorativní písmo s krásnými kudrlinkami a neobvyklými efekty.
`monospace`	Monospace písmo, u kterého je šířka každého znaku stejná.

Výchozí hodnota: písmo nastavené v prohlížeči ve výchozím nastavení. Obvykle je to Times New Roman.

Příklad

Nastavme písmu rodinu Arial:

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: Arial;
}

Příklad

Nastavme písmu rodinu Times New Roman. Protože název písma se skládá z několika slov, vezmeme jej do uvozovek:

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: "Times New Roman";
}

Příklad

Nastavme písmu písmo ze skupiny serif (nejspíše se vezme Times New Roman):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: serif;
}

Příklad

Nastavme písmu písmo ze skupiny sans-serif (nejspíše se vezme Arial):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: sans-serif;
}

Příklad

Nastavme písmu písmo ze skupiny fantasy (u vás to možná nebude fungovat z důvodu absence takového písma):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: fantasy;
}

Příklad

Nastavme písmu písmo ze skupiny monospace (písmena budou mít stejnou velikost):

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	font-family: monospace;
}