web相应式布局一些经验之谈

响应式布局常用技术

第一步：meta标签的应用。

<meta name="viewport" content="width=device-width,
initial-scale=1.0">

第二步：使用media-queries.js 或 respond.js 。

<!--[if
lt IE 9]> <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script> <![endif]-->

第三步：html结构

第四步：Media Queries

980px布局实例：

650px

480px移动设备

图片布局

媒体设备布局

Iphone布局

兼容性布局

560px布局

CSS中的Media Query（媒介查询）

3、语法结构及用法

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

可用设备参数

响应式布局实例地址

http://www.educity.cn/jianzhan/403677.html

http://www.cnblogs.com/lhb25/archive/2012/12/04/css3-media-queries.html

http://www.poluoluo.com/jzxy/201206/166577.html