一旦IE6缺乏对CSS功能的支持,例如“display:table-cell”和inline-block,导致“float”被劫持并用于布局 - 这是从未设计过的(或者特别擅长于)。
使用浮动似乎会导致过于脆弱的布局难以维护,并且通常会随着动态内容的变化而完全破坏。
这当时是一个必要的恶魔,但是现在对IE8之前的浏览器的支持不太重要了,理论上我们应该能够摆脱浮动并使用实际适用于布局的CSS部分 - 例如前面提到的display:table-cell和inline-block。
我目前正在考虑建议我的团队完全摆脱基于浮动的设计 - 我是否有把自己画到一个角落并遇到问题的风险,或者如果旧的浏览器支持不重要,这是一个更好的选择在我们的项目上?
答案 0 :(得分:5)
当然,只要您不需要更深入的浏览器支持。归结为它,真正重要的是页面是否正确显示给您网站的最大访问者数量,对吗?
您应该关注的另一个问题是可维护性,但我不能说在任何情况下这两种方法都比其他方法更难以维护。所以我只想问问自己团队更熟悉的布局方法以及需要支持的距离。
IE8 +支持 display: table-cell
。浮动显示可以一直回到IE6。
与你对浮子的说法相反,我认为当正确使用时,它们可以非常容易预测。我对他们的主要疑虑是需要清除有点尴尬的父母。此外,像Bootstrap和960-Grid这样的流行脚手架系统仍然选择使用花车,并且有充分的理由:它们很有用,具有很好的跨浏览器支持,并且可以做你需要做的事情。 / p>
话虽如此,未来对于Css和布局看起来很好。 Css中有两种即将推出的布局模型:grid system和flexbox model。目前还没有推荐,所以browser support is a bit shaky on them。
网格系统与display: table-cell
类似,但可以更好地控制。 Flexbox试图概括和抽象显示元素的想法,这允许真正强大,流畅(或“灵活”)的布局。一旦它们在浏览器中实现,这两者都会非常惊人。
如果您想了解有关flexbox使用情况的更多信息,请recommend the excellent MDN article about it
如果我是你,我会坚持并使用花车 - 特别是使用脚手架框架。我不担心长时间写脚手架Css;我使用框架,因为代码已经为我编写了。而且,对我来说,一旦flexbox和网格系统成为推荐并得到更广泛的实施,我只会发现完全重组项目是值得的。
答案 1 :(得分:2)
就像你说的那样是关于什么对你的团队最好的,但请相信我......如果你使用float
正确并且在正确的地方你没有得到布局,因为你改变了div内容。
但是在未来最好的方法是使用flexbox,你可以完成关于水平,垂直,相同大小,不同大小的块的所有内容......无论如何,当所有浏览器都支持它时,将会很有趣。< / p>