NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
NOVINKA - Online rekvalifikační kurz Java programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.

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