IE9에서 내 @font-face 규칙에 글꼴이 표시되지 않는 이유는 무엇입니까?

IE9에서 @font-face 표시 문제

Internet Explorer에서 글꼴을 표시하지 않는 @font-face 규칙 관련 문제가 발생합니다. 9(IE9)이지만 IE8을 포함한 다른 브라우저에서는 작동합니다. 또한 글꼴은 로컬에서 볼 때 표시되지만 웹 사이트가 라이브로 호스팅될 때는 표시되지 않습니다.

문제의 웹 사이트는 bigwavedesign.co.uk/gcc/gcc/이며 @font에 사용되는 CSS 코드입니다. -얼굴 규칙은 다음과 같습니다.

<code class="css">@font-face {
  font-family: 'LeagueGothicRegular';
  src: url('league_gothic_0-webfont.eot');
  src: local('League Gothic Regular'), url('league_gothic_0-webfont.woff') format('woff'), url('league_gothic_0-webfont.ttf') format('truetype'), url('league_gothic_0-webfont.svg#webfonta36nFpyE') format('svg');
  font-weight: normal;
  font-style: normal;
}</code>

분명히 이 문제는 다른 사람들도 유사한 문제를 보고했기 때문에 고립된 사례는 아닌 것으로 보입니다. IE9와 다른 브라우저의 주요 차이점은 IE9가 다른 브라우저에서 사용하는 .eot 버전 대신 .woff 버전의 글꼴을 사용하는 것으로 보인다는 것입니다. 이로 인해 프로젝트에 .woff 버전이 포함되어 글꼴이 모든 IE 버전에서 올바르게 작동하는 솔루션이 탄생했습니다.

다음 수정된 @font-face 규칙에는 .woff 버전이 포함되어 있으며 다음으로 보고됩니다. 문제 해결:

<code class="css">@font-face {
  font-family: "LucidaFax-bold";
  src: url("_font/LucidaFax-bold.eot");
  src: local("☺"),
  url("_font/LucidaFax-bold.woff") format("woff"),
  url("_font/LucidaFax-bold.ttf") format("truetype"),
  url("_font/LucidaFax-bold.svg#LucidaFax-bold") format("svg");
  }</code>

@font-face 규칙에 .woff 버전을 포함하면 다른 브라우저와의 호환성을 유지하면서 IE9에서 글꼴이 올바르게 표시되도록 할 수 있습니다.

위 내용은 IE9에서 내 @font-face 규칙에 글꼴이 표시되지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!