lacomix

Koristite bilo koji font uz pomoć @font-face

Vi ste ovde: CitySu team » Tutorijali » Koristite bilo koji font uz pomoć @font-face

Kategorija: Tutorijali  od: citysuteam.rs Komentari: (0)

Mnogo toga nam je donela nova verzija CSS3 između ostalog i @font-face. Ova funkcije je pojednostavila dodavanje i korišćenje različitih fontova na sajtovima. Ranije je to bio problem jer brauzer nije mogao da ispravno prikaže taj font ukoliko onaj ko pristupa sajt nema instaliran font na svom računaru.

Kako se koristi @font-face?

Da bi ste koristili bilo koji font na Vašem sajtu, sve što je potrebno jeste da koristite sledeći CSS kod:
@font-face {
font-family: nazivfonta;
src: url(‘neki font.ttf’);
}
Ovde je u font-family definisan naziv fonta (ovo ćete koristite kada u div-u ili u nekoj drugoj oznaci koja prikazuje tekst trebate da definišete font). Dok je u drugom delu koda (pod src) definisan putanja do fonta (on može biti u bilo kom folderu, samo je potrebno napisati ispravnu putanju).

Kako bi ste font koji ste upravo uneli u CSS sajta prikazali, potreban je još jedan CSS kod. Na sledećem primeru pokazaćemo kako da font prikažete na <p> oznaci ( <p> oznaka služi za prikaz teksta).

p  {
font-family:nazivfonta;
}
Kada bi ste ovaj kod otvorili u brauzeru, dobili bi ste sledeće:

css3 fontface

Prikaz koda u brauzeru

@font-face Možete primeniti na svim HTML oznakama koje mogu da prikažu tekst na stranici.

Izvor: dizajntutorijali.wordpress.com

Ostavite odgovor