字體不工作

嗨我想學會使用font-face添加一個不同的字體到我的瀏覽器，但我似乎缺少代碼中的東西，因爲風格不適用。這裏是我的代碼：字體不工作

<div id="logo"> 
     <img src="img/header/THANATHOS.png" alt="Logo"/> 
     <p>a gamers community</p> 
</div> 

<style> 
@font-face { 
    font-family: 'HarlowSolid'; 
    src: url('Fonts/normal/HarlowSolid.eot'); /* IE9 Compat Modes */ 
    src: url('Fonts/normal/HarlowSolid.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('Fonts/normal/HarlowSolid.woff') format('woff'), /* Modern Browsers */ 
     url('Fonts/normal/HarlowSolid.ttf') format('truetype'), /* Safari, Android, iOS */ 
     url('Fonts/normal/HarlowSolid.svg#svgFontName') format('svg'); /* Legacy iOS */ 
} 

div#logo p{ 
    font-family: HarlowSolid , Helvetica , sans-serif; 
} 
</style>

我在做什麼錯在這裏？

來源

2012-09-05 Nistor Alexandru

是包含路徑是否正確？記住它是相對於CSS文件而言的，而不是HTML中的那一個 –

是否忘記將和標籤中的css代碼包裝在一起？ –

什麼不工作？在哪些瀏覽器？你能通過URL訪問字體嗎？你有偷看開發工具欄嗎？它可以與其他字體一起使用嗎？絕對路徑？如果你對這個問題更具體，以及你試圖調試的東西，它會有所幫助。 – Jeroen

確保您已將其包裝在<style> /* Code Here */</style>標記中，或將其放入樣式表中。

同時檢查文件路徑你寫的代碼英寸所以如果它在/css/style.css和harlowSolid.woff是叫fonts根文件夾，那麼你的代碼將需要url('../Fonts/normal/HarlowSolid.woff')

而且檢查您正在測試的瀏覽器是否有support for font-face。儘管你已經包含了條件，但應該不會遇到問題。

只是爲了確認：您發佈的實際代碼是正確的，因此請檢查您的文件是否存在/結構是否正確。

如果您使用的是Chrome/Safari/FF，您通常可以右鍵單擊 - > Inspect Element，查看右下角的紅色齒輪符號，這將表示編碼/資源錯誤。（點擊查看有關問題的描述。）

來源

2012-09-05 14:59:38

第二個src是否正確？看一看http://www.w3schools.com/css3/css3_fonts.asp

@font-face { 
    font-family: 'HarlowSolid'; 
    src: url('Fonts/normal/HarlowSolid.eot'); /* IE9 Compat Modes */ 
    **src:** url('Fonts/normal/HarlowSolid.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('Fonts/normal/HarlowSolid.woff') format('woff'), /* Modern Browsers */ 
     url('Fonts/normal/HarlowSolid.ttf') format('truetype'), /* Safari, Android, iOS */ 
     url('Fonts/normal/HarlowSolid.svg#svgFontName') format('svg'); /* Legacy iOS */ 
}

來源

2012-09-05 15:55:47

回答

相關問題