爲網站用戶添加字體到HTML/CSS代碼（跨瀏覽器）

假設我有幾個用於PSD網站設計的.otf和.dfont字體文件。現在我需要將這些字體添加到HTML/CSS代碼中。我知道CSS3的@font功能。但是我確定它不適用於舊版瀏覽器？那麼跨瀏覽器的做法是什麼？爲網站用戶添加字體到HTML/CSS代碼（跨瀏覽器）

來源

2011-12-11 Karine

請在Stack Overflow提出問題之前考慮做一些研究。 – Marcin

這是一個非常好的點Marcin。感謝您的微妙修改。 – Karine

首先，網站不必都在所有的瀏覽器（http://dowebsitesneedtolookexactlythesameineverybrowser.com/）看看。在舊版瀏覽器中不顯示這些字體是完全正確的。只需提供@ThiefMaster提到的回退。

如果，你堅持使用同樣的字體，甚至對舊的瀏覽器，你可能要依靠的Cufón（http://cufon.shoqolate.com），跨瀏覽器的兼容性。使用特徵檢測（使用Modernizr）並有條件地加載Cufon庫。請注意，在正文上使用Cufon會使頁面加載速度變慢。 PS：所有IE版本都支持網頁字體嵌入。

來源

2011-12-11 11:28:13 apnerve

什麼是後備？你的意思是說提供後備？像給予類似的字體，而不是確切的字體 – Karine

是的。在你的樣式規則中，只要提供一個類似的字體，如果瀏覽器不支持'@ font-face ' – apnerve

cufon解決方案與ThiefMaster的解決方案有什麼區別？這是非常重要的。 – Karine

我使用FontSquirrel的@ font-face工具包生成器，在我看來它工作得很好。

瞧瞧吧http://www.fontsquirrel.com/fontface/generator

夏嘉曦

來源

2011-12-11 11:15:22

這是他已經知道的。他需要針對舊版瀏覽器的解決方案。 – apnerve

你是怎麼知道的？我提供了可用的最兼容的跨瀏覽器字體解決方案。你知道@font標籤的事實並不意味着你知道如何獲得一個具有各種字體格式的完全兼容的工具包。當然，對於較老的瀏覽器（IE6和朋友），你必須始終「回退」到一個標準字體，但對此沒有太多要做。 –

這裏有幾個問題：.dfont文件對於這個網站比3Mb大。我可以加載的字體數量有問題（只有3個），最後，Gotham-Black.otf字體有問題。（（（（（（（（（（ – Karine

您可以使用http://www.fontsquirrel.com/fontface/generator創建一個包含各種@font-face聲明一個兼容大多數CSS。

顯然會有一些舊的瀏覽器不支持它 - 對於那些在使用自定義字體時應該指定常規字體的應用程序，例如，像這樣：

p { font-family: "your font", sans-serif; }

來源

2011-12-11 11:17:14 ThiefMaster

FontSquirrel沒有爲我工作。另一方面，http://transfonter.org/對於將DFONT轉換爲TTF來說是完美的。

來源

2015-12-06 14:15:35 emisilva

爲網站用戶添加字體到HTML/CSS代碼（跨瀏覽器）

回答

相關問題