如何在CSS中结合使用粗体和斜体?

时间:2016-07-05 14:16:53

标签: html css fonts typography

This W3Schools tutorial教我如何使用CSS font-style属性使文本变为粗体(相当于旧式HTML中的<b&g>this</b>)以及如何使文本斜体(相当于旧版HTML中的<i>this</i>

但是,我似乎无法在任何地方找到如何使文本同时具有这两个属性(相当于旧式HTML中的<b><i>this</i></b>)。

有没有办法使用纯CSS做到这一点?

我试过这个:

font-style: italic bold;

结果是页面忽略了这两个属性,就好像我从来没有指定过这个属性。

当我尝试这个时,我得到了相同的结果:

font-style: italic, bold;

当我尝试这个时,我得到了不同的结果:

font-style: italic; bold;

这一次,发生的事情是它使用了第一种给定的样式(斜体)但忽略了第二种(粗体)。

这可以用纯css完成吗?

5 个答案:

答案 0 :(得分:73)

你很亲密。

italicfont-style一起使用,而粗体则与font-weight一起使用。

使用:

font-weight: bold;
font-style: italic;

答案 1 :(得分:2)

font-style是单值属性。无论如何,bold是font-weight。要组合多个值,可以使用简写font属性。但是,font简写需要输入:font-sizefont-family。如果您不以速记形式包含这两个,则将忽略该属性。

font简写与italic bold一起包含在内,并且它应该有效。

答案 2 :(得分:1)

W3Schools不好的另一个原因是,您应该使用font-weight设置粗体,font-style设置斜体。

font-weight: bold;
font-style: italic;

答案 3 :(得分:1)

使用这两个属性

可以使用斜体和粗体字体
font-style  : italic
font-weight : bold

font-weight doc:W3Schools font-weight

font-style doc:W3Schools font-style

答案 4 :(得分:0)

请看一下这段代码:

font: italic bold 12px/30px Georgia, serif;