@字體面有多個文件看起來Firefox和Chrome

不同我有CSS的Custom Arial字型臉regular, bold, italic and bold-italic風格。@字體面有多個文件看起來Firefox和Chrome

而對於所有不同的字體文件被創建arial_mt_stdregular，arial_mt_stdbold，arial_mt_stditalic和arial_mt_stdbold_italic

#span{ 
    font-family: 'arial_mt_stditalic'; 
    font-style: italic; 
    font-size: 30px; 
}

在Firefox中，這個應用斜體風格的兩倍，Chrome和IE。

所以我的內容看起來兩次斜體和在FireFox比Chrome和IE兩次大膽。

@font-face { 
    font-family: 'arial_mt_stdregular'; 
    src: url('arialmtstd-webfont.woff2') format('woff2'); 
    font-weight: normal; 
    font-style: normal; 
} 


@font-face { 
    font-family: 'arial_mt_stdbold'; 
    src: url('arialmtstd-bold-webfont.woff2') format('woff2'); 
    font-weight: normal; 
    font-style: normal; 
} 


@font-face { 
    font-family: 'arial_mt_stditalic'; 
    src: url('arialmtstd-italic-webfont.woff2') format('woff2'); 
    font-weight: normal; 
    font-style: normal; 
} 

@font-face { 
    font-family: 'arial_mt_stdbold_italic'; 
    src: url('arialmtstd-bolditalic-webfont.woff2') format('woff2'); 
    font-weight: normal; 
    font-style: normal; 
}

sample from FF and Chrome

爲什麼不採用Chrome和IE瀏覽器的字體樣式：斜體「arial_mt_stditalic」字體？

來源

2017-07-07 yogen darji

我懷疑這是瀏覽器嘗試當你提供了一個斜體，但告訴它不是斜體瀏覽器來模擬斜體。

當應用字體您有：

font-family: 'arial_mt_stditalic'; 
font-style: italic;

但在單@font-face爲rial_mt_stditalic你有

font-style: normal;

IE瀏覽器。你已經告訴瀏覽器以斜體使用非斜體字體。

所有的@font-face定義應該具有相同的值font-family，其他屬性然後告訴瀏覽器該特定下載是什麼變體，重量等。

當您使用FONT-FAMILY瀏覽器上的其他屬性相匹配來選擇下載。

即，你應該有：

#span{ 
    font-family: 'arial mt'; 
    font-style: italic; 
    font-size: 30px; 
} 

@font-face { 
    font-family: 'arial mt'; 
    src: url('arialmtstd-webfont.woff2') format('woff2'); 
    font-weight: normal; 
    font-style: normal; 
} 


@font-face { 
    font-family: 'arial mt'; 
    src: url('arialmtstd-bold-webfont.woff2') format('woff2'); 
    font-weight: bold; 
    font-style: normal; 
} 


@font-face { 
    font-family: 'arial mt'; 
    src: url('arialmtstd-italic-webfont.woff2') format('woff2'); 
    font-weight: normal; 
    font-style: italic; 
} 

// etc.

來源

2017-07-07 14:17:34 Richard

但是，我已經修改了一些斜體版本的字體，所以我已經設置不同的字體家族「arial_mt_stditalic」按我的要求。如何鉻不加倍粗體或斜體效果但Firefox嗎？有沒有什麼事情可以不改變font-family CSS？ –

@yogendarji瀏覽器如何處理字體沒有找到（在本案中：的「arial_mt_stditalic」斜體版本：瀏覽器不解析名稱）是最多的瀏覽器。 – Richard

@yogendarji這不是問題。相同的解決方案。它告訴瀏覽器爲斜體版本使用特定的文件。該文件是從類型設計師原始版本進行修改的。 – Richard

@字體面有多個文件看起來Firefox和Chrome

回答

相關問題