2011-03-12 110 views
0

我已經從字體松鼠下載了一個字體工具包,並用給定的代碼創建了一個css文件。我將所有woff,ttf,eot和svg文件複製到我的公用文件夾中,並創建了一個引用我想要使用的字體的h1代碼。但是,當我去檢查字體是否正常工作時,我只是得到新的羅馬標準時間。如果我在我想使用的字體旁邊放置一個備用字體,我就會得到該字體。有誰知道爲什麼會發生這種情況?這是我正在使用的代碼。無法讓@ font-face正常工作

@font-face { 
font-family: 'CartoGothicStdBook'; 
src: url('CartoGothicStd-Book-webfont.eot'); 
src: url('CartoGothicStd-Book-webfont.eot?iefix') format('eot'), 
    url('CartoGothicStd-Book-webfont.woff') format('woff'), 
    url('CartoGothicStd-Book-webfont.ttf') format('truetype'), 
    url('CartoGothicStd-Book-webfont.svg#webfont1l1oLWSU') format('svg'); 
font-weight: normal; 
font-style: normal; 

} 
.carto { 
font-family: CartoGothicStdBook, Arial; 
color: #333333; 
font-size: 44px; 
letter-spacing: -3px; 
} 

<h1 class= "carto"><b>Share Your Knowledge & Explore Your Passions<b></h1> 
+1

您可能需要顯示一些代碼 – 2011-03-12 20:35:19

+0

字體是否存在於正確的目錄中?你100%確定? – 2011-03-12 20:55:21

+0

他們列在公共目錄中。 – tomciopp 2011-03-12 20:56:08

回答

0

答案是上面列出,這是一個簡單的目錄問題。 Rails需要前導/添加一個目錄。

0

你是從外部樣式表導入這些字體嗎? 當我將字體放在同一個目錄中並將@ font-face聲明直接嵌入到我的頁面中(如果適用)時,我沒有任何問題,但似乎無法鏈接到相關源。我想知道這是否與許可問題上的所有爭議有關。另一件事......我似乎有更好的運氣參考與字體「」如:

ul li:nth-child(6n),#filler { 
    color:#3F9; 
    font-family:'WCRhesusABtaRegular'; 
    } 

其中相應的字體將是:

 @font-face { 
      font-family: 'WCRhesusABtaRegular'; 
      src: url('WC_Rhesus_A_Bta-webfont.eot'); 
      src: url('WC_Rhesus_A_Bta-webfont.eot?iefix') format('eot'), 
       url('WC_Rhesus_A_Bta-webfont.woff') format('woff'), 
       url('WC_Rhesus_A_Bta-webfont.ttf') format('truetype'), 
       url('WC_Rhesus_A_Bta-webfont.svg#webfonte627I3xy') format('svg'); 
      font-weight: normal; 
      font-style: normal; 

     } 

順便說一句,這是用於裝飾目的的真棒字體(如果你想在你的網站上去找Jackson Pollack),請不要閱讀:)

希望這可以幫助你解決更多的問題......如果你確實想出了一種方法來導入字體樣式表或將字體放在一個單獨的目錄中,我當然想聽到它...我還沒有能夠找到任何人正在導入字體的網頁上的例子......但我看到人們使用/ Fonts目錄。這也可能是與許可有關的項目?

對於那些剛剛開始使用@ font-face的人來說,這是一個快速提示(我只是自己開始着手)...... Paul Irish提到了一些「疑難雜症」,但是你應確保字體不在本地安裝,因爲如果可用,瀏覽器將使用本地字體 - 這會讓您的測試不可靠......當然,卸載字體並不難(至少在Windows 7中)。

下面是從保羅愛爾蘭一些更多的信息:

http://paulirish.com/2010/font-face-gotchas/#comment-48744

+1

我通過在我的公共目錄中的字體文件夾中列出所有下載的字體來實現它。然後,我在外部目錄中創建了font-face,然後將外部樣式錶鏈接到主應用程序。它沒有工作,因爲我沒有在應用程序中列出正確的目錄。 (我忘了給每個@ font-face文件添加一個/)。 – tomciopp 2011-03-14 15:20:17

+0

另一個選擇是base64對字體文件進行編碼,這是我最終在當時使用的解決方案(我有一些技巧從那時起就學會了:這裏有一篇關於如何讓IE9支持通過EOT加載WOFF文件的好文章:http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/) – Jordan 2011-04-25 02:27:48