css, li 全宽 ul

Question

我正在尝试制作一个无序列表，其中 li 元素跨越其父 ul 的整个宽度。例如，使用您的浏览器检查以下代码:

<ul>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ul>

您会看到 li 元素不是该行的 100%。您对如何解决这个问题有什么建议吗...

黄色的东西是 ul，文本从右边 50px 开始。

Answer 1

列表项 ( <li> ) 占用了 100% 的空间。这是默认的 padding在 <ul> 上你看到的。使用 ul {padding:0} 删除它

ul {padding:0}

<ul>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ul>