如果Li的样式为“float：left;”，如何为UL创建边框？

Question

我对ul的css是：

ul {list-style-type: none; margin:auto; border-top: 1px solid #0093a7; border-bottom: 1px solid #0093a7; margin: 20px 0;}
ul li {float:left; padding:5px;}

UL标签：

<ul>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
</ul>

现在两个边界都位于UL的顶部。 如何制作底部边框呢？

Answer 1

您需要将overflow:hidden应用于ul，以便您的花车被清除并包含在ul中。

目前您的ul正在折叠，因为它只包含浮动元素。

如果您需要支持IE6（？！），那么您需要确保您的容器（即ul）hasLayout以使溢出技巧起作用。您可以通过应用宽度来完成此操作。