HTMLH5页面元

刚玩儿H5，虽然学习了大量的属性，也做了不少的例子。

但是，一到实际开发页面，板块，许多问题就出来了。

许多新手都有这样的体会，今天我们来分享一些很实用的技巧。

原因很简单，只注重H5的新特性——

而忽视最为基础的页面布局！

很负责任的告诉你：

接下来这④个高度浓缩的兵法，绝对是集大成！

兵法一

H5非常强调代码的语义化。

早期开发往往应用表格来实现页面布局。

用过都知道，这是很糟糕的语义实现，冗杂难用，所有就理所应当被抛弃了。

现在，使用H5进行页面布局时，都是首先考虑代码的语义化。

尽量让代码中不包含冗余的DOM结构，而使用CSS样式完成布局。

往往是迫不得已，才适当添加一些DOM结构实现特定布局效果。

兵法二

绝大部份页面布局都是：

浮动（float）、定位（position）、内外边距（marginpadding）

三位一体有机结合，必须要打好扎实的基础！

兵法三

要对布局有更加深入的理解，还有掌握各种元素的呈现方式（display）以及整个页面空间布局关系。

这就是所谓的“文档流”，即BFC机制

兵法四

算上对IE浏览器老版本（6，7，8云云）的支持，不同浏览器、不同编译系统的页面布局实现难度都被大大提高。

比特世界的历史不管未来怎样，我知道到目前还不会倒退

所以我不主张，也不会阻止你花大量精力时间去修补过去的东西。

反正我自己不会去做。

况且如今大部分网站已经放弃了这些老版本浏览器

所以后面接下来的演示，很可能老版本浏览器不支持。。。

如果喜欢本系列HTML帖子

欢迎到鱼C论坛订阅专辑?

HTML5-庖丁解牛