请问在CSS中italic与oblique的区别

html-css026

请问在CSS中italic与oblique的区别,第1张

italic和oblique都是向右倾斜的文字, 但区别在于Italic是指斜体字，而Oblique是倾斜的文字，对于没有斜体的字体应该使用Oblique属性值来实现倾斜的文字效果.

CSS 2.1 文档：http://www.w3.org/TR/CSS2/fonts.html#font-styling

CSS3 文档：http://www.w3.org/TR/css3-fonts/#font-style-prop

MDN 文档：https://developer.mozilla.org/en-US/docs/Web/CSS/font-style

`font-style: oblique` 选择字体族的 oblique 变体。`italic` 选择字体族的 italic 变体，如果没有 italic 变体就妥协到 oblique 变体。如果字体族连 oblique 也未提供，则由浏览器合成倾斜的仿 oblique。

比如 `font-family: Georgia, serif` 时，指定 `font-style: italic`，则浏览器使用 Georgia Italic。若 `font-family: Microsoft YaHei, sans-serif` 时指定 `font-style: italic`，因为微软雅黑没有 italic 或 oblique 变体，浏览器只得将 regular 变体倾斜以自动合成仿 oblique。

没有什么应当使用 `oblique` 的场景。

如果你读完以上那些文档还不知道字体的 oblique 和 italic 分别是什么意思，读：既然浏览器能用算法将正常字体加粗和变斜，那么斜体有必要吗？

CSS 里没有「oblique 字体和 italic 字体」。CSS 里只有 `font-style` 这么一个属性以及该属性的 `oblique` 和 `italic` 等取值，这些取值要求浏览器选取相应的字体。理清逻辑。

1、打开html开发软件工具，新建一个html代码页面，创建一个<div>，同时给这个<div>添加一些文本内容和一个class类为 oblique。

2、使用font-style: oblique设置字体倾斜。创建<style>标签，然后在这个标签里面设置oblique类font-style属性为oblique。

代码：

<style>

.oblique{

font-style: oblique

}

</style>

3、最后，可以用链接打开可以看到已经倾斜45度，就是上面的代码编写即可。