Html 最好的方法是；清楚：两者都是“；

很久以来，我一直在使用一个名为

clear

的CSS类，它只有规则

clear:both

。我以以下方式使用它（以Django语法显示，但并不重要）：

{%用于集合%中的项]

{{item}}
{{item}}

{%endfor%}

如你所见，我正在做一系列水平列表，使它看起来就像一张桌子。假设CSS规则

.horiz li

意味着

浮动：左

。请注意，我在这个“表”中的每一行后面都使用了

，很多HTML都是为了简单的东西

---

真的是这样吗？还有什么我没有想到的更简单的吗？

有一种方法可以在CSS中实现

#李国宝{ 显示：块； 浮动：左； ....... } #页数：之后{ 内容：“.”； 显示：块； 身高：0； 明确：两者皆有； 可见性：隐藏； }

---

有什么原因不能使用

<ul class="horiz clear">

---

。。。对于除第一个之外的每个列表，最明显的解决方案是将

清除：两个
移动到布局中的下一个元素。如果这个
ul
后面跟着一个
div
，给这个
div
一个
class=“clear”
，等等。
如果你想让每个列表都显示其中的任何内容，而不必添加一个填充
div
标记，你可以用这个来调整列表的
溢出
属性：

.horiz
{
   overflow:hidden;
}

现在，即使列表项本身是浮动的，列表的内容也应该显示出来，而不会像现在那样折叠该区域，因为它们被移出了流。
请清除
ul
为什么不给你的ul和LI指定固定的宽度，其中ul的宽度至少是LI的两倍，但不到安利宽度的3倍

然后，您可以将所有LI放入一个UL中，并在LI上放置一个
float:left

这将导致每个列表项彼此相邻，但当它们用完空间时（由于UL的宽度），它们将换行到下一行。
另一条建议。您可以在“break（

）”标记中使用clear:both。无需在div中编码。请参阅下面的

用CSS编码：

.clear {
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

使用的是HTML:

.clear {
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}



试试看
 我同意洛格什·保罗的观点，
使用br而不是div会变得更简单

但是我认为你应该把clear元素放在循环之外。
你可以用
溢出：隐藏你的
ul
。这为每个
ul
建立了一个新的标准，这正是您想要的

我习惯于
清除：两者都是和你一样，但一旦我发现这个奇怪的小怪癖，我就开始几乎完全使用它。它在语义上似乎更优越，在99%的情况下都能正常工作。
是的，它很难看，我不确定使用它代码会更容易理解。它到底是如何“难看”的？CSS被设计为在必要时有多个元素类。丑陋的不是生成的HTML，而是使用Django的模板系统进行的条件检查。好吧，根据页面布局，您可以只使用“horiz clear”对于包括第一个列表在内的所有列表，只要不存在通常会与列表重叠的浮动内容。这不需要任何条件检查。或者，如果需要清除所有horiz列表，您可以将clearfix规则应用于“horiz”类。好主意，我实际上使用了一种类似于我页面另一部分的方法，它看起来像日历，其中每个浮动元素都是一个“天”。这是一个愚蠢的问题，但你列出的内容可以被视为表格数据吗？我知道这是封闭的，但我的答案是（谷歌搜索了一个类似的问题，发现这个页面是一个自动溢出的容器：是的，如果OP不关心IE6或IE7，as:after在这些页面中不起作用。
.clear {
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}