爲什麼我必須爲Web字體聲明特定的粗體/斜體變體？

我正嘗試在網站上使用Ubuntu字體。我正在使用FontSquirrel @ font-face生成器。在安裝了Ubuntu字體的計算機上，當我只有像font-family: Ubuntu這樣的css時，一切正常。但在其他計算機上，除非我明確說明我想要哪種特定變種font-family: UbuntuRegular或font-family: UbuntuBoldItalic，否則它將不起作用。在所有瀏覽器中都是相同的情況。爲什麼我必須爲Web字體聲明特定的粗體/斜體變體？

每次都要聲明重量和風格很愚蠢。是不是有一些方法來聲明一般的字體系列，並在需要時自動使用粗體和斜體？

來源

2012-02-11 Moss

嗯，我不知道，但我還使用自定義字體「SansationRegular」在使用字體生成器的窗口上，如果我沒有指定th電子狀態（風格，重量）或指定重量：粗體變薄（看起來很正常），但是當我使用字體重量：正常時，它變得有點大膽。 – 2012-02-11 20:19:56

大多數@ font-face生成器將font-weight和font-style設置爲normal，併爲每個權重/樣式使用單獨的聲明以實現向後兼容。但是你可以重寫聲明使用相同的姓氏爲每個變化，在每個只改變字體重量和字體風格在適當情況下，如：

@font-face { /* Regular */ 
font-family: 'Klavika'; 
src: url('klavika-regular-webfont.eot'); 
src: url('klavika-regular-webfont.eot?#iefix') format('embedded-opentype'), 
    url('klavika-regular-webfont.woff') format('woff'), 
    url('klavika-regular-webfont.ttf') format('truetype'), 
font-weight: normal; 
font-style: normal; 
} 

@font-face { /* Bold */ 
font-family: 'Klavika'; 
src: url('klavika-bold-webfont.eot'); 
src: url('klavika-bold-webfont.eot?#iefix') format('embedded-opentype'), 
    url('klavika-bold-webfont.woff') format('woff'), 
    url('klavika-bold-webfont.ttf') format('truetype'), 
font-weight: bold; 
font-style: normal; 
}

使H1應該繼承大膽的重量，而不需要指定重量：

h1{ font-family: 'Klavika';}

456伯里亞街有好的帖子詳細介紹了實現（兼容性）：http://www.456bereastreet.com/archive/201012/font-face_tip_define_font-weight_and_font-style_to_keep_your_css_simple/

來源

2012-02-11 21:58:55 mgcross

非常好。和不錯的文章。出於某種原因，我並不是因爲你使用@ font-face聲明將字體名稱設置爲任何你想要的。字體松鼠應該更新他們的樣式表在我看來，或者至少提供一個替代版本。 – Moss 2012-02-12 01:35:03

非常感謝這個信息;正是我所期待的。 – nickpish 2013-09-24 04:58:45

爲什麼我必須爲Web字體聲明特定的粗體/斜體變體？

回答

相關問題