我一直认为处理CSS浮动的正确方法是使用一个明确的div:在伪类之后,或者在父类上使用overflow:auto。据我所知, 设计用于清除浮动并将父元素扩展回正常。那是它的目的,是吗?
今天我发现了一种处理浮动(和父崩溃)的替代方法:浮动父项以使其在浮动子项周围展开。
这与网络标准如何一致?是否有官方的浮动/明确标准?
答案 0 :(得分:1)
此处没有特别标准。使用在这种情况下的任何工作。
添加额外的HTML元素只是为了清除浮动是不受欢迎的,但偶尔会有用。
我个人更喜欢使用漂浮父母的Float Nearly Everything风格,但它并不适合所有情况。
答案 1 :(得分:1)
所有这些方法都很糟糕 - 浮动从来没有真正设计用于我们使用它们的各种布局。它们旨在控制图像之类的文本流。因此,正如埃德韦雷特所说,没有一种获得批准的方法 - 在您的环境中使用任何可行的方法!
我个人更喜欢overflow:hidden方法,因为它简单。我从来没有遇到过这个问题。
带上css3和多列!
答案 2 :(得分:0)
当我第一次学习CSS时,我使用了亲子浮动方法(有趣的故事,我实际上只使用了浮点数+宽度(现在我已经读过它并不那么有趣))但是现在我觉得它只是简单的脏。我的意思是你在哪里停下来?你是不是只想把所有东西都搞砸了?
这当然会起作用,但我发现更优雅的解决方案是在必要时应用浮子(适当地衬里元素)并适当地清除它们。这些天我甚至提出了一些立场:绝对和位置:相对于混合。
清除是为了移除浮动,我不确定它是否有用。
当然,CSS是一个可以正确学习的somb1tch所以也许我刚输入的所有东西都是纯粹的猜想,你不应该听我的任何舌头摇摆。
答案 3 :(得分:0)
正如@edeverett所说,没有特别的标准。
真正的初学者使用绝对定位并进入梦魇模式,因为有很多限制和需要注意的事项。
初学者倾向于将内容中的所有内容浮动,然后搜索父级的背景所在的位置,尽管流程中没有内容,父级不再具有可见的背景...
IE6和最后一栏(对整个设计来说太大)的困难时期都在其他人之下(因为是否会使利润浮动bug增加一倍或宽度为100%+填充/边缘对孩子而言)
然后你学习了许多不同的技巧,每种技术都有它的强度,约束和问题。
然后,您将通过经验来了解以使用它们。甚至在很少的情况下绝对定位;在绝望的情况下甚至是布局表。它们很糟糕,但是一旦你在某处添加1px就会有25个div等待爆炸的布局更糟糕 根据经验,从流中删除内容越少,问题就越少。在CSS中总是有很多方法可以做同样的事情。
我个人最喜欢的是多才多艺的 display: inline-block;
现在Fx 3.x已经取代了Fx 2.0(3.0甚至消失了),每个浏览器都支持它(display: inline;
+ zoom: 1;
+ IE的条件评论< 8)。
我能想到的两个小烦恼:
</div><!-- comment --><div>
之类的技巧才能避免它vertical-align: top;
经常是必需的,当你开始使用它时很难发现在带有标签+每行输入的表单上,与浮点数相比,它确实有奇效。在页眉或页脚中也是如此。