IT rekvalifikace s garancí práce. Seniorní programátoři vydělávají až 160 000 Kč/měsíc a rekvalifikace je prvním krokem. Zjisti, jak na to!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Fonts (písma) - CSS3

S nástupem CSS3 již nejsme nuceni používat pouze "web-safe" písma a můžeme si přidat svoje vlastní.

Používání vlastního písma

Pomocí @font-face si nadefinujeme vlastní písmo:

@font-face
{
    font-family: mojeVlastniPismo;
    src: url('Sansation_Light.ttf'),
         url('Sansation_Light.eot'); /* IE9+ */
}

div
{
    font-family: mojeVlastniPismo;
}

Nastavení tučného písma

Pro definování tučného písma přidáme další @font-face a do něj dáme odkaz na tučné písmo a vlastnost font-weight: bold

@font-face
{
    font-family: mojeVlastniPismo;
    src: url('Sansation_Bold.ttf'),
         url('Sansation_Bold.eot'); /* IE9+ */

    font-weight: bold;
}

 

Všechny články v sekci
Text a písmo - CSS vlastnosti
Článek pro vás napsal David Jančík
Avatar
Autor je vášnivý programátor. Nezná slovo "nelze", nebojí se zkoušet nepoznané a pronikat do nových technologií.
Aktivity