如何添加边框到列表样式？

Question

所以我有项目列表，我正在使用list-style: decimal;，但我想为{1}还为该小数添加边框。 这是我的小提琴：https://jsfiddle.net/zzzpLqwq/有什么建议吗？

Answer 1

使用list-style-position: inside和border本身的<li>：

ul {
  list-style: decimal;
  display: inline-block;
}
li {
  background: red;
  list-style-position: inside;
  border-bottom: 1px solid #ccc;
}

<ul>
  <li>First</li>
  <li>Second</li>
  <li>Thrid</li>
</ul>

您更新的JSFiddle