如何学习布局设计? DIV + css还是新的CSS3 GRID 2D布局?

时间:2013-05-18 04:02:39

标签: html5 css3 layout html

我是一个想要在HTML中学习布局设计的新手。

据我所知,应该使用DIV和css样式。

但在我搜索时,我发现了CSS3 2D网格布局的新草案:

http://www.w3.org/TR/css3-grid-layout/

  

这个CSS模块定义了一个二维的基于网格的布局系统,   针对用户界面设计进行了优化

  

擅长为应用程序的主要区域划分空间,   或者根据大小,位置和层次来定义关系   从HTML原语

构建的控件的各部分之间

通过查看它们和那里的图表,它似乎更适合布局设计。

是否有人使用过这个并且可以建议是否应该花时间学习这个新的2D网格,而不是花时间学习使用DIV进行布局设计?再一次,我对HTML很新,并试图要求选择正确的学习方法。

添加

还有CSS网格模板布局模块http://dev.w3.org/csswg/css-template/

  

该草案结合了早期草稿中关于模板布局,网格的想法   定位[CSS3GRID]和网格布局[CSS3-GRID-LAYOUT]。

1 个答案:

答案 0 :(得分:-1)

此功能仍处于草稿状态。这意味着它还没有最终的标准。草案可以随时改变,所以任何人都可以使用它。根据{{​​3}},唯一支持它的浏览器是Internet Explorer 10和11。

在所有常用的Web浏览器广泛采用某项功能之前,您不应该使用它。这可能需要数年时间,因此您现在应该学习传统的CSS定位。

更新: 4年后,大多数浏览器都支持网格布局,因此它成为了Web开发的可行工具。但是仍有一些例外情况可能需要做一些工作,以确保在没有网格布局支持的情况下,您的应用程序至少不会完全无法使用。另外请记住,网格布局和div定位的“经典”方式都是工具。为每项工作使用正确的工具。网格布局的存在不是拒绝学习其他布局技术的借口。