<分区>
我需要创建一组列表项，其中我需要使用边框半径和背景色设置列表项编号(小数)的样式。
这是我希望我的列表项看起来像的快照。
我尝试在 li 上设置边框半径和背景，但无法获得我正在寻找的输出。
这是一个 WORKING LINK 到目前为止我尝试过的。我删除了边框半径、背景等，因为它们显示不正确。
HTML:
<ul>
<li>Text Character</li>
<li>Text Character</li>
<li>Text Character</li>
<li>Text Character</li>
<li>Text Character</li>
</ul>
CSS:
li{list-style-type:decimal;}
我希望针对上述问题提供以下解决方案..
等待解决方案。
最佳答案
这里有一个小技巧:
ol {
counter-reset: item;
margin-left: 0;
padding-left: 0;
}
li {
display: block;
margin-bottom: .5em;
margin-left: 2em;
}
li:before {
display: inline-block;
content: counter(item) "";
counter-increment: item;
background: blue;
color: white;
display: inline-block;
border-radius: 50%;
margin: 0 5px ;
padding: 0 5px;
}<ol>
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
<li>Item4</li>
</ol>关于html - 带有样式化十进制数字的 UL 列表项，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18636050/