html - 如何为列表样式添加边框？

Question

所以我有元素列表，我正在使用 list-style: decimal; 但我只想为 li 添加边框，也为那个小数。这是我的 fiddle :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