font-style

概述

font-style CSS 属性允许你选择 font-family 字体下的 italicoblique 样式。 Italic 样式一般是指书写体,相比无样式的字体,通常会占用较少的高度,而 oblique 字形一般只是常规字形的倾斜版本。斜体(italic) 和倾斜体(oblique)都是通过人工倾斜常规字体的字形来模拟的(参见 font-synthesis 对此的控制)。

初始值normal
适用元素all elements. It also applies to ::first-letter and ::first-line.
是否是继承属性yes
适用媒体visual
计算值as specified
是否适用于 CSS 动画
正规顺序the unique non-ambiguous order defined by the formal grammar

语法

font-style: normal;
font-style: italic;
font-style: oblique;

/* Global values */
font-style: inherit;
font-style: initial;
font-style: unset;

normal
选择 font-family 的常规字体。
italic
选择斜体,如果当前字体没有可用的斜体版本,会选用倾斜体oblique )替代。
oblique
选择倾斜体,如果当前字体没有可用的倾斜体版本,会选用斜体( italic )替代。

正式语法

normal | italic | oblique

示例

示例展示了不同的 font-style 值。CSS 看起来像这样:

.normal {
  font-style: normal;
}

.italic {
  font-style: italic;
}

.oblique {
  font-style: oblique;
}

请注意,不是所有的字体都有确切的 obliqueitalic 字形,即便如此,浏览器也会通过使用现有的字形来模拟所缺少的字形。下面是一个使用这两种字形渲染字体的示例:

规范

规范 状态 注释
CSS Fonts Module Level 3
font-style
Candidate Recommendation 没有变化
CSS Level 2 (Revision 1)
font-style
Recommendation 没有变化
CSS Level 1
font-style
Recommendation 初始定义

浏览器兼容性

特性 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基础支持 1.0 1.0 (1.7 or earlier) [1] 4.0 7.0 1.0
特性 Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
基础支持 1.0 1.0 (1) [1] 6.0 6.0 1.0

[1] 在 Firefox 44 之前,Gecko 并不对 obliqueitalic 字形做出区分。在那之后,如果有可用的字形,它将使用正确的字形。

文档标签和贡献者

 此页面的贡献者: xhlsrj
 最后编辑者: xhlsrj,