CSS-字體家族-使用webfont-service后備嗎？

Question

對於我的一個項目，我使用由webfont-service托管的字體。 沒有任何后備，代碼看起來像這樣： font-family:'Amasis MT W01 italic'; 您會看到，字體樣式（斜體）已經包含在內，因為這是客戶支付的費用。 當我向其添加后備時，它當然可以工作，但后備字體不是斜體，這會導致頁面外觀發生急劇變化。 有沒有解決辦法？ 將“ Amasis MT W01 italic'設置為“雙斜體”字體的斜體結果，因此這不是一種選擇。

實際上，僅使用CSS時，我需要諸如“如果無法使用Amasis以斜體顯示Helvetica”的內容。 我想那不可能嗎？ 有其他選擇嗎？

Answer 1

如果實際字體為斜體，則應在@font-face規則以及使用該字體的普通CSS代碼中聲明font-style: italic 。

font-family: 'Amasis MT W01 italic', Helvetica;
font-style: italic;

（在字體家族名稱中使用斜體一詞是不合邏輯的，但這只是一個名稱；只要您始終使用該名稱，也可以在那里使用foobar 。）

但是，我不知道為什么著名的無襯線字體Helvetica（在絕大多數計算機中被Arial取代）是否會替代Amasis家族（具有強大襯線）的字體。

Answer 2

遇到了同樣的問題，並在此處找到了解決方案： http : //spaceninja.com/2010/11/29/font-face-faux-styles/它可以為我工作。 只需確保定義所有@ font-face規則即可，例如：

@font-face {
    font-family: 'Ubuntu'; /* regular */ /* 'Amasis' in your case */
        src: url('Ubuntu-R-webfont.eot');
        /* more sources here */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Ubuntu'; /* italic */ /* 'Amasis' in your case */
        src: url('Ubuntu-R-webfont.eot');
        /* more sources here */
    font-weight: normal;
    font-style: italic;
}

然后在需要的地方使用它：

h2 {
    font-family: 'Ubuntu'; /* 'Amasis' in your case */
    font-style: italic;
}