CSSでフォントを埋め込む

Question

下記のCSSを使用してフォントをインポートしようとしていますが、FirefoxやIEでは動作しますが、Chromeではサポートされていません。あなたはそれもChromeで動作させるために私を助けることができますか？

@font-face { 
    font-family: "Fontin-Bold"; 
    src: url(fonts/Fontin-Bold.ttf); 
    src: url(fonts/Fontin-Bold.eot); 
} 

Answer 1

さまざまなブラウザがあり、フォントも例外ではありません。ここでは完全な例です：

CSS

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

} 

あなたが好きなフォント・フェイス・ジェネレータを使用しての優れている：さらに、あなたはフォントにの.htaccessを設定する必要がFont Squirrel

以下のタイプのフォルダ：

AddType application/vnd.ms-fontobject .eot 
AddType font/ttf .ttf 
AddType font/otf .otf 

---

EDITED：

が良く異なるフォント形式VS異なるブラウザを説明するために：

• FirefoxとSafariのサポートTTFまたはOTF形式。
• Internet ExplorerはEOT形式をサポートしています。
• Firefox 3.6は新しいWOFF（ウェブフォント ファイル用の新しいフォーマット提案）をサポートしています。
• Google Chrome、iPhoneのSafariでSVGファイルを使用できるようにする @ font-face;