CSS3--响应式布局

一、流式布局

　　不再使用px作为盒模型布局，而是采用百分比布局宽高，定位等。

　　公式：目标元素宽度/上下文元素宽度=百分比宽度

　　　　　目标定位/上下文元素宽度或高度=定位距离（保留5位小数点）

　　用em/rem来替换px

　　　　1、em的值并不是固定的；

　　　　2、em会继承父级元素的字体大小。

　　　　3、rem为css新增属性，全称root em（root指html元素）

　　弹性图片大小

　　　　图片设置width：100%，或者background-size：100% 100%。

　　　　图片设置阈值：max-width

二、响应式布局

　　根据不同屏幕分辨率使用不同的样式和布局结构

　　媒体查询

　　　　@media 设备名 only （选取条件） not （选取条件）and （设备选取条件），设备二{sRules}

　　　　<link rel="stylesheet" type="text/css" media="only screen and (max-width:480px)" href="link.css">

CSS3--响应式布局

原文：http://www.cnblogs.com/llz1314/p/5738542.html