2017-12-01 21 views
0

각도 재료 아이콘이있는 각도 재료를 사용합니다.IE는 때때로 WOFF 및 때때로 EOT 글꼴 유형을로드합니다.

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

이 줄은 @ 글꼴 얼굴의 선택과 CSS 파일을 다운로드 : 내 index.html을에서 , 나는 다음과 같은 태그가 있습니다. 그것은 CSS에서 오는 "src"속성이 브라우저에 따라 다른 것 같습니다.

Chrome에서는 아무 문제없이 WOFF2 글꼴을 다운로드합니다. 그러나 IE11에서는 브라우저가 WOFF 글꼴과 때때로 EOT 글꼴을 다운로드하는 경우가 있습니다. WOFF를 사용하면 아이콘이 표시됩니다. EOT는 그렇지 않습니다.

Chrome logs

IE11 logs

는 WOFF 폰트를 다운로드 브라우저를 강제하는 방법 아이디어가 있습니까? font-face를 로컬에 저장하는 것을 피하고 싶습니다.

감사합니다.

+0

사용하려는 글꼴이 유용할까요? – Rob

+0

물론 IE가 WOFF 형식으로 다운로드하기 때문에 아이콘이 표시됩니다. 글꼴은 Google의 Material Icon입니다. IE는 특히 Fiddler가 열려있을 때 WOFF로 다운로드합니다 ... – mike

+0

가끔씩 * 동일한 글꼴 *이 다운로드되고 현혹 된 것으로 다운로드되는 다른 시간이 있습니까? – Rob

답변

0

글쎄, 마침내 Material Icon 글꼴을 사용하는 방법이 변경되었습니다.

나는 나의 index.html 파일에서 다음 줄을 삭제 :
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 

나는 NPM을 통해 재료 디자인 아이콘을 패키지를 설치하고 내 각-CLI의 스타일 섹션을 구성. JSON 파일은 다음과 같은 CSS 파일을 가리 키도록 :
"styles": [ 
    "<relative_path>/node_modules/material-design-icons/iconfont/material-icons.css" 
] 

이제 IE11은 항상 WOFF 형식을로드합니다.

문제가 해결되었습니다.