Google Web Fonts non viene caricato in Chrome per iOS

Quando utilizzo i Webfonts di Google, vengono caricati correttamente su tutti i browser a cui tengo, TRANNE Chrome/iOS. Questo sembra strano, poiché funziona bene su Chrome per Mac e Safari per iOS, quindi non penso che sia un problema iOS o un problema di Google Chrome. Sembra essere specifico per Chrome/iOS.Google Web Fonts non viene caricato in Chrome per iOS

Qualsiasi idea o idea su COME risolvere questo problema sarebbe ottima!

Grazie!

EDIT

Sto usando Google Web Fonts ospitati su Google, con il seguente:

<link href="http://fonts.googleapis.com/css?family=Leckerli+One" rel="stylesheet" type="text/css" />

Nel mio carattere (SASS), io sto usando il seguente:

h1 
    font-family: "Leckerli One", cursive

fonte

2012-12-09 andrewpthorp

Come stanno utilizzando Google font web - come da remoto ospitati da Google, o sul proprio server? (Questo spesso fa la differenza.) Quali caratteri? Qual è il codice esatto che stai utilizzando? –

Hai provato a scaricare il font, ospitandolo da solo e vedendo se viene visualizzato? Potrebbe valere la pena di un colpo. –

Andrew- Hai un link al tuo sito? Attualmente sto usando Google Webfonts sul mio sito e funzionano su Chrome su iOS. Ho anche provato con quel font e sembra funzionare: http://www.djfarrelly.com/test/ – djfarrelly

sto vedendo lo stesso problema. Ospitare i file di font sul mio server e riscrivere le regole di @ font-face per risolvere il problema risolto, sia con il mio server di sviluppo locale che con prod.

Non so la causa; la mia ipotesi migliore sarebbe un problema di origine identica applicato in modo diverso in UIWebViews (iOS Chrome è un UIWebView dovuto alle regole dell'App Store).

fonte

2012-12-18 14:39:58 Dave

le risposte dovrebbero davvero rispondere alla domanda, se così non fosse e vuoi dire qualcosa, per favore ad un commento (puoi farlo se hai una reputazione di 50) –

Ho risolto il problema, e ho risposto alla sua domanda originale. Se non avessi risposto al suo seguito teorico, allora mi sarei aspettato di non ricevere la taglia, e tutto sarebbe stato solo nel mondo. – Dave

Nel CSS è possibile utilizzare

!important

Esempio:

@font-face { 
    font-family: 'Monda' !important; 
    font-style: normal !important; 
    font-weight: 400 !important; 
    src: local('Monda Regular'), local('Monda-Regular'), url(http://themes.googleusercontent.com/static/fonts/monda/v1/sk05J8GA1NvUxDnk43EgAQ.woff) format('woff') !important; 
}

fonte

2012-12-09 22:46:36 Enve

Si prega di elaborare in quanto la risposta non ha alcun senso. – Marko

Sta suggerendo che l'istanza CSS qui venga sovrascritta più avanti nel foglio di stile (quindi: CSS-Cascading Style Sheet), quindi potrebbe essere necessario usare! Important per sovrascriverlo; tuttavia non credo che questo sia il tuo problema. –

I dispositivi IOS utilizzano solo formati TTF (o OTF se seguono le linee guida per gli sviluppatori di seguito). Quel font viene servito come WOFF, EOT e OTF (presumibilmente non seguendo le linee guida). Ci sono alcuni services che ti daranno altre versioni. Prova a specificare il carattere usando @ font-face e vedi se questo risolve il problema! Fontsquirrel ha un @font-face generator per fare il sollevamento pesi.

Per quanto riguarda la domanda di follow-up. Ci sono alcuni documenti per sviluppatori di Apple sulla loro implementazione dei font TrueType. Può essere trovato here. Essenzialmente, i formati TTF memorizzano il font come risorse sfnt. L'unico altro formato di carattere che può farlo è il wrapper sfnt della tabella sfalsata di OpenType. Poiché IOS legge i caratteri usando i wrapper sfnt, ti imbatterai in problemi con i caratteri che non sono memorizzati in questo modo. (Ci scusiamo per tutti i discorsi di jargonny).

fonte

2012-12-19 17:38:20

Non è la mia esperienza: almeno in iOS6, i font WOFF funzionavano bene (in Safari e in Chrome dopo che li avevo serviti dal mio server). Vedi la mia risposta a questa domanda. – Dave

È possibile utilizzare lo Google Fonts API Loader che rileverà il browser dell'utente e restituirà CSS formattato in modo appropriato.

Il codice di esempio è disponibile nella prima risposta su this Stack Overflow question.

Ciò consentirà sia Safari che Chrome (e altri browser basati su UIWebView) per visualizzare correttamente il carattere.

Nota: se si desidera memorizzare i caratteri localmente, come suggerito da @Dave, this CSS dovrebbe funzionare.

fonte

2012-12-21 02:12:52

Nel caso in cui qualcun altro veda ancora questo problema - un carattere che non si carica in Chrome su iOS 9 o precedente - controlla che il carattere sia importato come file css e non come file js. Tipi di carattere.com ti darà la possibilità di importare i caratteri come js, che non verranno rilevati su Chrome/iOS 9 o sotto. Cambiare la mia importazione in css ha risolto questo problema per me.

fonte

2016-12-01 19:51:38 mixophrygian

Per me i lavori aggiungere nella pagina PHP:

<style type="text/css"> 
@import url('https://fonts.googleapis.com/css?family=Trocchi'); 
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i'); 
</style>

fonte

2017-05-13 21:27:32 Max

Google Web Fonts non viene caricato in Chrome per iOS

risposta

Problemi correlati