Css flexbox vs tables，为什么我们需要flexbox？

有谁能告诉我新的Flexbox布局模型如何比当前的表格更好？（显示：表格和所有这些都包含在我的案例中）

IE10完全不支持它，这在不久的将来不是很好，我只是看不到表布局有什么好处。但是，互联网上已经开始充斥着这种新的CSS布局方法的“崇拜者”，我看到的所有例子都可以很容易地用普通的CSS完成，没有任何问题

---

更新25.12.15:

---

自从flexbox被引入现代浏览器以来，我一直在使用flexbox，并且已经停止使用

display:table

等等，因为flexbox功能更强大，使用更方便

简单地说，几年后这将是有益的。像许多先进的css技术、HTML5等一样，在未来几年中，一些人将采用这些技术，并进行痛苦的回退和调整

---

将来浏览器支持它时，我们会有一个聚会，所有人都讨厌不支持它们的“旧”浏览器：）。

我可以想到使用flexbox和使用表显示值或浮动来布局页面之间的三个区别：

能够在不考虑HTML源顺序的情况下对元素重新排序，同时将元素保持在正常流中—您可以通过使用属性指定整数值来实现这一点

与传统的浮点布局相比，它需要更少的类型（您不需要为了清除目的而使用所有的伪元素），并且更具语义，而在布局中使用浮点或表显然不是

通过使用

flex-grow

和

flex-shrink

属性，flex项能够根据祖先元素的维度进行增长和收缩，以填充水平和垂直空间

问题是（正如你所指出的）支持仍然很差；事实上，Firefox仍在实现旧版本的flexbox模块，因此您必须考虑语法和行为上的细微差异，这取决于您使用的浏览器。不过，有人说，布局是未来的发展方向，特别是对于越来越频繁出现的复杂web应用程序。如果你愿意做出一个不可避免的明智投资，那么这是值得学习的——代价是现在还不能真正使用

---

我还建议您查看flexbox的友好介绍（这是最近编写的）

flexbox模型比显示表更强大。例如，Flexbox支持从右向左语言的布局。的确，flexbox有点复杂，这是一个进入壁垒。Float和clearfix布局是一个（聪明的）黑客，不知何故，表布局也是一个黑客，flexbox是用于布局的

---

有人说，浏览器支持最近越来越好了。然而，Bootstrap 3没有使用flexbox，但我可以想象下一个版本会使用它。

但是我可以用当前CSS做你能想到的一切，我看不出flexbox是如何变化的anything@vsync：在没有flexbox的情况下，您可能会获得大部分结果，但在某些情况下，只有同时调整DOM时才能获得。@DanielA.R.Werner。是的，我在几年前写过，当时flexbox还远没有稳定和“关闭”。从那以后我一直在用它extensively@vsync是的，我同意。我的“几年后”现在在这里。我现在还不到三个flexbox…好吧，你知道，今天仍然相关。我以前从未听说过这个模型，但快速看一眼，它看起来很酷-它最终似乎提供了一种语义上干净的方式来完成所有布局工作，过去只有表格才有可能完成这些工作（对齐栅格顶部/中心/底部中的图元，使一组图元动态拉伸）但是没有

s或疯狂的

display:table

解决方法。

dispay:table

在我看来一点都不疯狂，而且非常优雅。它将一个元素描述为一个表，然后你可以随心所欲地控制它的子元素，语义部分总是由你决定，flexbox不是HTML，它只是css。

display:table

仍然与表的概念相联系，当您构建布局时，表的概念在语义上是不正确的。Flexbox似乎终于打破了这一点，并添加了更多控制布局的方法。我一直在等待类似这样的东西（但很明显，单独使用时，它还没有为大众市场做好准备……将其与

display:table

结合使用是没有意义的，因为所有浏览器都支持它）Firefox现在实际上相当不错。即使没有前缀。对于你来说，这是一个观点：虽然有很多人说它是布局的未来。那么网格布局呢？它是一个“黑客”如果你这么看的话，我不认为

display:table

是一种黑客行为，而是一种在页面上组织信息的方式。浮动可以和其他任何东西一样复杂，这取决于实现。我个人认为，这是一个非常有才华的人做的引导，仅仅因为基努·里夫斯出名并不能让他成为一个好演员r、 想想看……对不起，关于表格布局，我指的是使用real

s的老式布局技术。ho well表格是表格，不是布局：）