响应式布局！

响应式布局！

移动互联网多终端！---催生了响应式布局！
优点： 解决了设备只见的差异化展示
缺点：兼容性代码多，工作量比较大，加载速度收到影响
对原有网站布局会产生影响，用户判断不一定准确
原则：移动设备优先，渐进增强充分发挥硬件设备的最大功能。
实现：CSS3-media query 原生js（不建议推荐） 第三方框架bootstrap
CSS3-Media Query
常见属性：device-width，device-height 屏幕宽高
width ， height 渲染窗口宽高，可视窗口
orientation 设备方向（竖屏，横屏）
resolution 设备分辨率
外联式：<link rel="stylesheet" type="text/css" href="styleB.css" media="screen and (min-width: 600px) and (max-width: 800px)">
内联式：@media screen and (max-width: 600px) { /当屏幕尺寸小于600px时，应用下面的CSS样式/
.class {
background: #ccc;
}
}
css3需要持续看！之前学习的bootstrap还是很有用处的！