Strona 1 z 1

Dodanie własnej czcionki

PostWysłany: 14 Kwi 2015, 01:55
przez droidexxx
Witam
Robię sobie stronkę i mam problem z dodaniem własnej czcionki z pliku w formacie ttf. Robię to w następujący sposób:
Kod: Zaznacz wszystko
@font-face {
    font-family: StayPuft;
src: url('../fonts/StayPuft.ttf');
}


i potem użycie np:
Kod: Zaznacz wszystko
h2 {
font-family:  StayPuft;
}



Czcionka, którą tutaj podałem to ta z templatki Windu i też nie chce działać. Już nawet próbowałem w bardziej prostacki sposób i też nie działało:
Kod: Zaznacz wszystko
src:url('http://localhost/webpage12/data/themes/bootstrap-jumbotron/fonts/StayPuft.ttf') format('ttf');

Edytuję plik less.css. Użycie important również nie dało. Co robię źle?

Re: Dodanie własnej czcionki

PostWysłany: 14 Kwi 2015, 20:22
przez rwd5
Poprawnie powinno tak to wszystko wyglądać (kultowe "U mnie działa" :P) - może chodzić o "format()" lub o cudzysłowy:
1) w katalogu głównym szablonu graficznego tworzymy katalog /fonts/ gdzie dodajemy plik .ttf.
2) w pliku css na samej górze dodajesz:
Kod: Zaznacz wszystko
@font-face {
  font-family: 'StayPuft';
  src: url('StayPuft.ttf')  format('truetype');
}

body {
  font-family: 'StayPuft', Fallback, sans-serif;
}


*Jeśli nie zadziała, może być jakiś problemo ze ścieżkami, najlepiej będzie umieścić plik .ttf w tym samym katalogu co plik .css i wtedy w cssie wygląda to tak:
** Można zmienić nazwę pliku na małe litery, może okazać się pomocne jak nie ruszy.

Pozdrawiam

Re: Dodanie własnej czcionki

PostWysłany: 15 Kwi 2015, 14:45
przez droidexxx
Dzięki, już wszystko działa ;)