2017-12-01 3 views
0

Ich benutze Angular Material mit Angular Material Icon. In meinem index.html, ich habe den folgenden Tag:IE lädt manchmal WOFF und manchmal EOT Schriftart

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 

Diese Zeile lädt eine CSS-Datei mit einem @ font-face-Selektor. Es scheint, dass die "src" -Eigenschaft, die vom CSS kommt, je nach Browser unterschiedlich ist.

Mit Chrome kein Problem, es wird eine WOFF2-Schriftart heruntergeladen. In IE11 lädt der Browser manchmal eine WOFF-Schriftart und manchmal eine EOT-Schriftart herunter. Mit WOFF werden Symbole angezeigt. Mit EOT sind sie nicht.

Chrome logs

IE11 logs

Haben Sie eine Idee, wie Browser zu zwingen WOFF Schrift herunterladen? Ich möchte vermeiden, font-face lokal zu speichern.

Vielen Dank!

+0

Ist die Schriftart, die Sie verwenden möchten, in Woff verfügbar? – Rob

+0

Natürlich manchmal IE es als WOFF Typ und Symbol wird so angezeigt. Schriftart ist Material Icon von Google. IE lädt es als WOFF, vor allem, wenn ich Fiddler geöffnet habe ... – mike

+0

Sie sagen also manchmal * die gleiche Schriftart * wird als Woff heruntergeladen und andere Zeiten, die es als EOT heruntergeladen wird? – Rob

Antwort

0

Nun, ich habe endlich den Weg zur Verwendung der Material Icon Schriftart geändert.

Ich löschte die folgende Zeile in meiner Datei index.html:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 

Ich installierte Material-Design-Ikonen Paket über NPM und ich konfiguriert, um den Arten Abschnitt meiner Winkel-cli. json Datei auf der CSS-Datei wie folgt Punkt:

"styles": [ 
    "<relative_path>/node_modules/material-design-icons/iconfont/material-icons.css" 
] 

Nun IE11 immer WOFF Art lädt.

Problem gelöst!

Verwandte Themen