使 ABC 有序列表项具有粗体样式

Question

我有一个 html 有序列表，类型设置为“A”

 <ol type="A">...</ol>

因此，每个列表项将以 A、B、C 等开头。

我想将 A、B、C 字母设置为粗体。我试过设置 font-weight:bold;通过 css，但它没有用。关于如何执行此操作的任何建议？

原文由 Yaakov Ellis 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

有点作弊，但它有效：

HTML:

 <ol type="A" style="font-weight: bold;">
  <li><span>Text</span></li>
  <li><span>More text</span></li>
</ol>

CSS：

 li span { font-weight: normal; }

原文由 peirix 发布，翻译遵循 CC BY-SA 2.5 许可协议

Answer 2

作为替代和卓越的解决方案，您可以在 before 元素中使用自定义计数器。它不涉及额外的 HTML 标记。 CSS 重置应该与它一起使用，或者至少从 ol 元素 ( list-style-type: none, reset margin ) 中删除样式，否则该元素将有两个计数器。

 <ol>
    <li>First line</li>
    <li>Second line</li>
</ol>

CSS：

 ol {
    counter-reset: my-badass-counter;
}
ol li:before {
    content: counter(my-badass-counter, upper-alpha);
    counter-increment: my-badass-counter;
    margin-right: 5px;
    font-weight: bold;
}

一个例子：http: //jsfiddle.net/xpAMU/1/

原文由 Speed 发布，翻译遵循 CC BY-SA 3.0 许可协议