font-style
font-style CSS 描述符允許作者為 @font-face 規則中指定的字型指定字型樣式。
對於某個特定的字型家族,作者可以下載對應同一字型家族不同樣式的各種字型字形,然後使用 font-style 描述符來明確指定字型字形的樣式。此 CSS 描述符的值與對應的 font-style 屬性的值相同。
語法
css
font-style: normal;
font-style: italic;
font-style: oblique;
font-style: oblique 30deg;
font-style: oblique 30deg 50deg;
值
normal-
選擇字型家族的正常版本。
italic-
指定字型字形是正常字型的斜體版本。
oblique-
指定字型字形是正常字型的人工傾斜版本。
- 帶角度的
oblique -
選擇歸類為
oblique的字型,並額外指定文字傾斜的角度。 - 帶角度範圍的
oblique -
選擇歸類為
oblique的字型,並額外指定文字傾斜的允許角度範圍。請注意,只有當font-style為oblique時才支援範圍;對於font-style: normal或italic,不允許使用第二個值。
正式定義
| 相關的 at-rule | @font-face |
|---|---|
| 初始值 | normal |
| 計算值 | 同指定值 |
正式語法
font-style =
auto |
normal |
italic |
left |
right |
oblique [ <angle [-90deg,90deg]>{1,2} ]?
示例
指定斜體字型樣式
例如,考慮 garamond 字型家族,在正常形式下,我們得到以下結果
css
@font-face {
font-family: "garamond";
src: url("garamond.ttf");
}

此文字的斜體版本使用與未樣式版本中相同的字形,但它們被人為傾斜了幾度。

另一方面,如果存在字型家族的真正斜體版本,我們可以將其包含在 src 描述符中並將字型樣式指定為 italic,以便明確該字型是斜體。真正的斜體使用不同的字形,並且與它們的直立對應物略有不同,具有一些獨特的特徵,通常具有圓潤和書法般的品質。這些字型由字型設計師專門建立,並且不是人為傾斜的。
css
@font-face {
font-family: "garamond";
src: url("garamond-italic.ttf");
font-style: italic;
}

規範
| 規範 |
|---|
| CSS 字型模組第 4 級 # font-prop-desc |
瀏覽器相容性
載入中…