1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > html5css字体斜体 你未必知道的CSS小知识:font-style的oblique属性值

html5css字体斜体 你未必知道的CSS小知识:font-style的oblique属性值

时间:2019-12-19 19:16:56

相关推荐

html5css字体斜体 你未必知道的CSS小知识:font-style的oblique属性值

对与css的font-style属性,我估计大家每次见到的都是使用“normal”或 “italic”两个属性值。但事实上,你还可以让它赋值为“oblique”。请看下面的演示:

HTML代码

Oblique Text

Italic Text

CSS代码

h1 {

font-weight: normal;

font-family: Georgia, serif;

font-style: oblique;

text-align: center;

font-size: 50px;

}

h1:nth-child(2) {

font-style: italic;

}

p {

font-family: Arial, sans-serif;

text-align: center;

}

演示

这是什么意思?为什么“oblique”和斜体”italic”的效果是一样的?

CSS规范中是这样描述“oblique”的:

“…让一种字体标识为斜体(oblique),如果没有这种格式,就使用italic字体。”

这里描述所用的“oblique”和“italic”都是倾斜的意思。“oblique”在维基百科里的解释就是一种排版术语,就是一种倾斜的文字,但不是斜体。

因为“oblique”对于font-style来说是一种合法的属性值,它可和italic进行互换,除非真有一种字体只提供了oblique体而没有提供斜体。

但我似乎从来没有听说过哪种字形提供过oblique字体,也许我错了。研究发现,一种字库好像不能同时提供斜体和oblique两种字体,因为oblique基本上是一种模仿的斜体,而不是真正的斜体。

所以,如果我没有猜错的话,如果一种字库里没有提供斜体字,那当使用CSS的font-style: italic时,浏览器实际上是按font-style: oblique显示的。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。