CSS3 @ font-face Opera 11.xのレンダリングされていないフォント

Question

OperaでHTML5サイトが正しく表示されないという問題が発生しています。サイトと私の@ font-faceは、Safari、Chrome、IE9、Firefox 3.5+などで完璧に動作しています。ここに私のコードの内訳です：

私はフォントというフォルダがあります。このフォルダにはすべての私のフォントファイルとこのようになりますstylesheet.cssと呼ばれるスタイルシートを持っています

@font-face { 
    font-family: 'LeagueGothicRegular'; 
    src: url('League_Gothic-webfont.eot'); 
    src: url('League_Gothic-webfont.eot?#iefix') format('embedded-opentype'), 
     url('League_Gothic-webfont.woff') format('woff'), 
     url('League_Gothic-webfont.ttf') format('truetype'), 
     url('League_Gothic-webfont.svg#LeagueGothicRegular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 

マイホームページがそれに応じて、このスタイルシートを参照している：

<link rel="stylesheet" href="fonts/stylesheet.css" type="text/css"/> 

私はに似メニューを持っていますこの：このような別のファイルを見て、このメニューの

<nav> 
    <div class="main_nav"> 
     <div class="nav_button"> 
      <ul> 
       <li class="red"><a href="index.htm">HOME</a> 
        <ul> 
         <li><a href="about.htm">ABOUT</a> 
          <ul> 
           <li><a href="history.htm">History</a></li> 
           <li><a href="management.htm">Management</a></li> 
          </ul> 
         </li> 
        </ul> 
       </li> 
      </ul> 
      ... 
     </div> 
    </div> 
</nav> 

私のスタイル：

.nav_button {height:110px; margin:0px 1px 0px 0px; font: 34px 'LeagueGothicRegular', Arial, sans-serif; letter-spacing: 0; line-height:34px; float:left;} 

.nav_button ul { 
    margin: 0px 0px 0px 0px; 
    padding: 0px; 
    display:block; 
    float: left; 
    position: relative; 
    list-style: none; 
    cursor:pointer; 
} 
.nav_button ul li { 
    margin: 0px 0px 0px 0px; 
    padding: 0px; 

    float: left; 
    position: relative; 
    list-style: none; 
} 

もう一度、このコードは他のブラウザで正常に動作します。これはOpera 11.xで吠えているだけで、レンダリングされません。どんな助けでも大歓迎です！

Answer 1

これは、フォントファイルが未知のまたは予期しないコンテンツタイプヘッダーで提供されている場合に発生することがあります。

WOFFファイルとTTFファイルがContent-Type: "application/octet-stream"ヘッダーで配信されていることを確認します。

Apacheを使用している場合は、以下を.htaccessファイルに追加します。

<IfModule mod_headers.c> 
    <FilesMatch "\.woff$"> 
    Header set Content-Type "application/octet-stream" 
    </FilesMatch> 

    <FilesMatch "\.ttf$"> 
    Header set Content-Type application/octet-stream 
    </FilesMatch> 
</IfModule> 

（そして、これが動作しない場合は、上記のコードのjsFiddleを投稿してください。）