响应式Web设计：HTML5和CSS3实战
2016-02-18 本文已影响0人
鸟麦
html5改变了什么？
1.语义化标签，原有的依靠div、span标签+类名的方式被各式的html5标签取代
<header></header>
<section><article></article></section>
<nav></nav>
<aside></aside>
<footer><footer>
2.引入媒体标签
<video></video>
<audio></audio>
3.简化html头部标签
css3改变了什么
1.响应式设计，原因是媒体查询的引入，css可以根据客户端的显示情况设定合适的显示策略
2.固定布局转换成流式百分比布局，变更公式：
百分比=父级原有固定宽度/元素原有固定宽度
宽度的相关值应转换成百分比宽度，比如：
margin-left,padding-left,width,left
高度的相关值、边框仍保留固定px
height,border
字体改为em单位
font-size:1em //1em默认为16px，依然使用百分比大小
浏览器适配方案
渐进增强与优雅降级，最佳实践是以移动端为标准方案，针对老旧浏览器使用增强脚本。
