如何将em标签重新设置为粗体而不是斜体

Question

我希望将<em>标记内的文字设为粗体而不是斜体。有没有办法用CSS实现这个目标？

Answer 1

当然，请使用以下CSS代码：

em {
   font-weight: bold;
   font-style: normal;
}

Answer 2

您可以将以下内容添加到您的css

em { font-style: normal; font-weight: bold; }

您还可以创建一个用于特定em标签的类

CSS: .non-italic{ font-style: normal; font-weight: bold; }
HTML: <em class="non-italic"></em>

或者您可以更改特定的em标签（不是很好的做法）

<em style="font-style:normal; font-weight:bold;"></em>

Answer 3

将font-style设置为normal以强制<em> 始终 为非正常或inherit从父级继承设置（ demo）：

<div class="normal">
    <h1><code>font-style:normal;</code> <small>- Always non-ital</small></h1>
    <p>Should not be ital: <em>Foo</em></p>
    <p class="ital">Should be ital: <em>Foo</em></p>
</div>
<div class="inherit">
    <h1><code>font-style:inherit;</code> <small>- Inherits from parent</small></h1>
    <p>Should not be ital: <em>Foo</em></p>
    <p class="ital">Should be ital: <em>Foo</em></p>
</div>

.normal em {
    font-weight:bold;
    font-style:normal;
}
.inherit em {
    font-weight:bold;
    font-style:inherit;
}
.ital {
    font-style:italic;
}