[css] Własne fonty na stronie www


(Abrimaal) #1

Witam,

Znalazłem w kodzie css jednej strony taką linię:

@import url(https://fonts.googleapis.com/css?family=Ubuntu);

Pozwala ona na użycie nietypowego kroju pisma na stronach,

skopiowałem to do pliku css na swojej stronie i działa.

Jednak nie wiem jak uniezależnić się od tego adresu,

chciałbym mieć plik z fontem na serwerze tam gdzie są moje strony.

Nie wiem jak zrobić, abym mógł użyć niestandardowego kroju z pliku .ttf, który umieszczony byłby na "moim" serwerze.


(Cezaris) #2

Ja korzystam z generatora na stronie http://www.fontsquirrel.com/fontface/generator. Wrzucamy za jednym razem max. 3 pliki czcionek (jeżeli licencja czcionki nie pozwala na umieszczenie jej na stronie to wyskoczy komunikat). Potwierdzamy że czcionki są legalnego pochodzenia i generuje się nam gotowe spakowane archiwum z przerobionymi własnymi czcionkami do umieszczenia na stronie www, W paczce jest też plik css, także podpinamy go do naszej strony lub po prostu kopiujemy jego zawartość do naszego css'a. pozdrawiam


(floyd) #3

(soanvig) #4

tu jest ładnie opisane


(Gawronino) #5

Dodając swój font do strony pamiętaj, że IE nie obsługuje czcionek .ttf i konieczna jest konwersja Twojej czcionki na .eot i dodanie ich obu do css. Następnie w kodzie css dodajesz:

xxx{

font-family: Allegro, Allegro2;

}

, gdzie Allegro - to czcionka w ttf, a Allegro2 - to czcionka eot :slight_smile:


(floyd) #6

Sprawdzałeś, że IE nie obsługuje czcionek .ttf czy tylko tak wyczytałeś?

IE8 i IE9 u mnie obsługuje, a pewnie i IE7, to o czym piszesz dotyczy wersji wcześniejszych z przesławnym IE6 na czele.


(Gawronino) #7

Sprawdziłem, IE 8 też miała z tym problem.


(floyd) #8

No, to mamy widocznie różne IE8 bo u mnie nie ma problemu.


(Gawronino) #9

IE dziwną przeglądarką jest.

Swoją drogą konwersja czcionki + jej dodanie do kodu to max 2 minuty roboty, a może pozwolić uniknąć rozjechania się interfejsu strony. Więc chyba warto dmuchać na zimne :slight_smile:


(Abrimaal) #10

Mniejsza z IE, kto tego używa (?)

Ja "jadę" na Ffox.

Wpisałem w css fragment kodu na samym początku:

/* 
@font-face {

   font-family: metro-df;

   src: url(http://abrimaal.pro-e.pl/metro-df.ttf);

i dalej w definicjach np.:

A:link {font-family: "metro-df","Segoe UI", Tahoma;

	COLOR: #cc61ff; TEXT-DECORATION: none; border-color=#cc61ff

i nie działa, wyświetla wszystkie linki pismem Segoe UI. :?

(To przykład, bo np. A:hover, A:visited... też są tak zmienione)


(Gawronino) #11

Mógłbyś podać adres strony, gdzie używasz tego css?


(floyd) #12

Być może pod tym adresem nie ma takiej czcionki, ściągnij ją sobie na własny serwer. Poz tym czcionka ta kiepsko wyświetla polskie litery, chyba że ich nie używasz.

metro-df


(Abrimaal) #13

Strona jest po angielsku w większosci, dla polskich opisów używam Segoe UI lub Ubuntu.

Adres: http://abrimaal.pro-e.pl

css: http://abrimaal.pro-e.pl/vmain.css

Teraz działa, musiałem dodać format("truetype")

@font-face {

font-family: 'metro-df';

src: url(metro-df.ttf) format("truetype")

}