我有一个html有序列表,类型设置为“A”
<ol type="A">...</ol>
因此,每个列表项将以A、B、C等开始。我想将A、B、C字母的样式设置为粗体。通过css,但它没有工作。有什么建议如何做到这一点?
a5g8bdjr1#
有点作弊,但它的工作:于飞:
<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; }
l7wslrjt2#
作为一个替代的和上级的解决方案,你可以在before元素中使用一个自定义计数器。它不涉及额外的HTML标记。CSS重置应该与它一起使用,或者至少从ol元素(list-style-type: none, reset margin)中删除样式,否则该元素将有两个计数器。
ol
list-style-type: none, reset margin
<ol> <li>First line</li> <li>Second line</li> </ol>
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/
mpbci0fu3#
您确定您正确地应用了样式,或者没有其他样式表干扰您的列表吗?我尝试了以下方法:
<ol type="A"> <li><span class="label">Text</span></li> <li><span class="label">Text</span></li> <li><span class="label">Text</span></li> </ol>
然后在样式表中:
ol {font-weight: bold;} ol li span.label {font-weight:normal;}
它加粗了A、B、C等,而不是文本。(在Opera 9.6、FF 3、Safari 3.2和IE 7中进行了测试)
A
B
C
waxmsbnn4#
我知道这个问题有点老了,但在很多Google搜索中它仍然是第一个出现的。我想添加一个不涉及编辑样式表的解决方案(在我的例子中,我没有访问权限):
<ol type="A"> <li style="font-weight: bold;"> <p><span style="font-weight: normal;">Text</span></p> </li> <li style="font-weight: bold;"> <p><span style="font-weight: normal;">More text</span></p> </li> </ol>
erhoui1w5#
你也可以这样做:
ol { font-weight: bold; } ol > li > * { font-weight: normal; }
所以HTML中没有“style”属性
fcy6dtqo6#
另一个更短的解决方案是使用li::marker现在的widely supported。
li::marker
ol li::marker { font-weight: bold; }
wf82jlnq7#
你也可以这样做:<ol type="A" style="font-weight: bold;">
<ol type="A" style="font-weight: bold;">
<li style="padding-bottom: 8px;">****</li>
对于初学者来说,这是一个简单的代码。此代码已在“Mozilla,chrome和edge..
7条答案
按热度按时间a5g8bdjr1#
有点作弊,但它的工作:
于飞:
CSS:
l7wslrjt2#
作为一个替代的和上级的解决方案,你可以在before元素中使用一个自定义计数器。它不涉及额外的HTML标记。CSS重置应该与它一起使用,或者至少从
ol
元素(list-style-type: none, reset margin
)中删除样式,否则该元素将有两个计数器。CSS:
示例:http://jsfiddle.net/xpAMU/1/
mpbci0fu3#
您确定您正确地应用了样式,或者没有其他样式表干扰您的列表吗?我尝试了以下方法:
然后在样式表中:
它加粗了
A
、B
、C
等,而不是文本。(在Opera 9.6、FF 3、Safari 3.2和IE 7中进行了测试)
waxmsbnn4#
我知道这个问题有点老了,但在很多Google搜索中它仍然是第一个出现的。我想添加一个不涉及编辑样式表的解决方案(在我的例子中,我没有访问权限):
erhoui1w5#
你也可以这样做:
所以HTML中没有“style”属性
fcy6dtqo6#
另一个更短的解决方案是使用
li::marker
现在的widely supported。wf82jlnq7#
你也可以这样做:
<ol type="A" style="font-weight: bold;">
对于初学者来说,这是一个简单的代码。
此代码已在“Mozilla,chrome和edge..