2012-12-05 30 views
1

沒有顯示這是我的代碼:Unimportable字體在IE9

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

} 

我無法顯示的字體圖標

回答

1

我以前也有很多的麻煩,這一點我自己。與HTML/CSS文件相關的根文件夾比較,檢查下載字體文件的位置。

例如,如果所有字體位於根文件夾中的相同位置,則上面的代碼是正確的。

還有其他兩種情況可能出現。第一個是,如果你下載了他們進入所謂字體這是根目錄中的文件夾中新創建的文件夾,代碼如下所示:

@font-face { 
    font-family: 'font-icon'; 
    src: url('fonts/richstyle-webfont.eot') format('eot'); 
    src: url('fonts/richstyle-webfont.eot?#iefix') format('embedded-opentype'), 
     url('fonts/richstyle-webfont.woff') format('woff'), 
     url('fonts/richstyle-webfont.ttf') format('truetype'), 
     url('fonts/richstyle-webfont.svg#richstylemedium') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 

另一種情況可能是,如果該文件是在另一個文件夾位於您的網站根目錄中,但字體文件位於字體中,它們位於完全獨立的文件夾中。訪問它的方式是創建一個不同的相對鏈接,如下所示:

@font-face { 
    font-family: 'font-icon'; 
    src: url('../fonts/richstyle-webfont.eot') format('eot'); 
    src: url('../fonts/richstyle-webfont.eot?#iefix') format('embedded-opentype'), 
     url('../fonts/richstyle-webfont.woff') format('woff'), 
     url('../fonts/richstyle-webfont.ttf') format('truetype'), 
     url('../fonts/richstyle-webfont.svg#richstylemedium') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 

這要看你怎麼一點在代碼中的URL源。就像我說過的,之前我曾經遇到過這個問題。先試試看看是否有幫助。

你可以做的另一件事是做同樣的這個人對他的答案貼:@font-face works in IE8 but not IE9

他還補充這個smileyface本地:src: local("☺"),到代碼,所以你的代碼應該是這樣的:

​​

下面是寫出的代碼的一種更好的方式。嘗試一下,看看它是如何工作的:

@font-face { 
    font-family: 'font-icon'; 
    src: local("☺"), 
     url('fonts/richstyle-webfont.eot') format('eot'), 
     url('fonts/richstyle-webfont.eot?#iefix') format('embedded-opentype'), 
     url('fonts/richstyle-webfont.woff') format('woff'), 
     url('fonts/richstyle-webfont.ttf') format('truetype'), 
     url('fonts/richstyle-webfont.svg#richstylemedium') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 

希望這有助於!

+0

它不工作。我目前正在從本地機器本身執行它。它現在不在Firefox中工作。我從中複製的字體是圖標類型的字體。鏈接是 - > http://openfontlibrary.org/en/font/richstyle – thanmai

+0

這個鏈接http://openfontlibrary.org/en/font/richstyle我早些時候發佈的,我在IE 9中試過了,但它似乎這些人沒有寫任何代碼在IE9中顯示。它仍然是一樣的。 – thanmai

+0

@thanmi也許你可以嘗試像紳士說,並採取字體和使用字體松鼠創建CSS字體代碼和字體文件,供您在本地使用的網站insteal關閉鏈接 – Abriel

0

試試這個:

@font-face { 
    font-family: 'font-icon'; 
    src: url('fonts/richstyle-webfont.eot'); 
    src: local('?'), 
     url('fonts/richstyle-webfont.otf') format('opentype'); 
} 

或本

@font-face { 
    font-family: 'font-icon'; 
    src: url('fonts/richstyle-webfont.eot?') format('eot'), 
    url('fonts/richstyle-webfont.woff') format('woff'), 
    url('fonts/richstyle-webfontb.ttf') format('truetype'); 
} 

這個來自愛爾蘭的保羅的Bulletproof font post

+0

我試過了,但是它不工作:(。謝謝。 – thanmai

+0

你是否在本地工作?試試通過XAMP/WAMP/MAMP/LAMP服務器運行。 –

+0

我沒有在本地系統中使用任何服務器,它只是一個普通的html, css文件,我在網絡瀏覽器中打開它,其中url是文件位置。 – thanmai

0

改變font-family: 'font-icon';下面介紹如何使用RichStyle字體: http://richstyle.org/richstyle-theme/theme.css

我的意思是這樣的:

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

}

其中{網址}是RELATIVE loca字體的重刑。