• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Mozilla nie wyświetla czcionek z Google

VPS Starter Arubacloud
0 głosów
658 wizyt
pytanie zadane 27 grudnia 2017 w HTML i CSS przez kirazare Nowicjusz (120 p.)

Witam wszystkich,

Tak, jak w temacie Mozilla nie wyświetla czcionek pobranych od Google. Żeby było ciekawiej sytuacja ma miejsce nie na komputerze, na którym napisałem kod, a na drugim (na obu zainstalowana jest Mozilla). W Chromie - zarówno na jednym, jak i drugim komputerze - wszystko działa w porządku. Gdzie może tkwić problem?

Zaznaczę, że sprawdzałem dokładnie, co na ten temat piszą na Google Fonts. Próbowałem już również podpinać czcionki w CSS przez fontface. Wrzucam kod, jak podpinam czcionki w html:
 

<head>
<link href="https://fonts.googleapis.com/css?family=Amatic+SC|Enriqueta|Source+Sans+Pro:200,400,600&amp;subset=latin-ext" rel="stylesheet">
</head>

i css:

 

@import url('https://fonts.googleapis.com/css?family=Amatic+SC|Enriqueta|Source+Sans+Pro:200,400,600&subset=latin-ext');

/*Amatic_SC*/

	@font-face {
	font-family: 'Amatic SC', cursive;
	src: url("style/Amatic_SC/AmaticSC-Regular.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

/*Enriqueta*/

	@font-face {
	font-family: 'Enriqueta', serif;
	src: url("style/Enriqueta/Enriqueta-Regular.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

/*Source Sans Pro*/
	@font-face {
	font-family: 'Source Sans Pro', sans-serif;
	src: url("style/Source_Sans_Pro/SourceSansPro-ExtraLight.ttf") format("truetype");
	font-style: normal;
	font-weight: 200;
}
	@font-face {
	font-family: 'Source Sans Pro', sans-serif;
	src: url("style/Source_Sans_Pro/SourceSansPro-Regular.ttf") format("truetype");
	font-style: normal;
	font-weight: 400;
}
	@font-face {
	font-family: 'Source Sans Pro', sans-serif;
	src: url("style/Source_Sans_Pro/SourceSansPro-SemiBold.ttf") format("truetype");
	font-style: normal;
	font-weight: 600;
}

Próbowałem dodać nawet linijkę do css'a:

 

ul li {
    font-family: 'Source Sans Pro', sans-serif;
    font-family: 'Enriqueta', serif;
	font-family: 'Amatic SC', cursive;
}

Ale i to nie działa.

Jakieś pomysły?

1 odpowiedź

0 głosów
odpowiedź 27 grudnia 2017 przez adrian17 Ekspert (348,220 p.)

Mozilla 

W sensie Firefox? :D

U mnie na Chromie i FF na dwóch różnych maszynach wszystko wygląda poprawnie:

https://jsfiddle.net/53sLj3ex/

Dałbyś screenshota przeglądarki, gdzie to nie działa? Najlepiej od razu ze screenami devtoolsów (konsoli i/lub inspektora z zaznaczonym ostylowanym tekstem)

komentarz 27 grudnia 2017 przez kirazare Nowicjusz (120 p.)

A czy może to być kwestia samych ustawień przeglądarki? Np. zabezpieczeń?
I czy jest możliwość przetestowania strony - jak będzie wyglądać na innych komputerach - gdy jeszcze nie znajduje się na serwerze?

Oto problem:



Jak widać, czcionki nachodzą na siebie i wychodzą poza divy. Jest to jednak kwestia związana z tym, że Mozilla nie ładuje czcionek, które podałem wcześniej  i zamienia je na domyślne.

komentarz 27 grudnia 2017 przez adrian17 Ekspert (348,220 p.)
Powtórzę: zajrzyj w konsolę i inspektor. Tam zapewne znajdziesz odpowiedź.

Podobne pytania

0 głosów
1 odpowiedź 464 wizyt
0 głosów
1 odpowiedź 426 wizyt
0 głosów
2 odpowiedzi 1,476 wizyt

92,840 zapytań

141,781 odpowiedzi

320,856 komentarzy

62,172 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...