HTML5与HTML4的区别-----通用的排版结构

一个网页通常分为：头部，主体内容和脚部三个部分，当然也有其他更细的划分方法。

以移动端为例，

当给一个设计图，我通常使用一下结构；

<div  class="container">

　　<header class="header">

　　　　<img src="./logo.png" />

　　　　<a href="#">返回首页</a>

　　　　<span class="menu_btn">分类菜单</span>

　　</header>

　　<section class="mainbody"></section>

　　<footer class="footer">

　　　　<a href="#">提意见<br><small>手机网易</small></a>

　　　　<span class="menu_btn">分类菜单</span>

　　</footer>

</div>

对于header section footer等新增的元素,在低版本浏览器IE8及以下不识别，会转成 div元素。不考虑到兼容可以不加类名。

在编写html时，结构越简单越好。

样式相同的地方，提取出相同的类名。

img元素，当在网页中具有实际意思的使用img，而不是背景图片。 网站的logo具有实际意义，使用img元素插入

使用背景图？在网页中没有实际意义，只起到样式或者修饰作用。例如 按钮的背景

在移动端常用到布局：  弹性盒布局  和 响应式布局