包含Museo的字體堆棧在FireFox和Opera中都不起作用

我正在使用三種不同的字體。這是我的@fontface包含Museo的字體堆棧在FireFox和Opera中都不起作用

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

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

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

第一個和第三個工作正常。

第二個是爲身體標記作爲指定：

body, button, input, select, textarea { 
font: 16px/1.625 MuseoSans500 "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", sans-serif; 
_font-size: 1em; 
color: #333; 
}

這在Chrome和Safari運行完美

然而，在Opera 11.50和Firefox 4.0.1，壞消息;整個字體堆棧不起作用，並且字體呈現爲普通老式serif（yuck！）

我認爲問題在於Museo，因爲當我將Museo從字體堆棧中取出時它正確呈現。

我使用的是Windows 7的

來源

2011-10-08 WebMuggle

是否仍然在第二位的CSS後MuseoSans500添加逗號時打破？ – andreasbovens

不，我很尷尬！謝謝！ – WebMuggle

這些瀏覽器你缺少一個逗號。

font: 16px/1.625 MuseoSans500 "Lucida Grande" 
font: 16px/1.625 MuseoSans500, "Lucida Grande" 
          ^^^ add this comma

來源

2011-10-08 19:14:02 thirtydot

謝謝。多麼尷尬 - 我花了很多時間試圖解決這個問題，它一直在我的臉上盯着我！傻我。 – WebMuggle

雖然您現在缺少逗號，但根據您的說法，您遇到了正文文本的MuseoSans500字體問題。當你刪除它，你很好。我認爲您現在向您顯示您的代碼時，逗號會丟失。

我會嘗試設置字體家庭一次選擇一個，看看會發生什麼。我還要以防萬一分開字體大小和行高從而隔離問題，像這樣：

body, button, input, select, textarea { 
    font-family: MuseoSans500; /* start with this one by itself */ 
    font-size: 16px; 
    line-height: 1.625; 
    color: #333; 
}

來源

2016-07-23 18:45:14

包含Museo的字體堆棧在FireFox和Opera中都不起作用

回答

相關問題