响应式框架简单知识介绍

响应式框架英文 respond layout意在实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。

一、出现的背景

在移动互联日益成熟的时候，我们在桌面浏览器上开发的网页已经无法满足移动设备的阅读。

通常的做法是针对移动端单独做一套特定的版本。

但是如果终端越来越多那么你需要开发的版本就会越来越多（大屏移动设备普及）。

那么Ethan Marcotte在2010年5月份提出的一个概念，简而言之，就是一个网站能够兼容多个终端。

二、大势所趋

为什么说是大势所趋呢？
现在的移动设备屏幕越来越大。
越来越多的设计师也采用了这种设计。

在新建站的一些网站现在普遍采用的响应式开发。

三、响应式原理

CSS3中的Media Query（媒体查询）
通过查询screen的宽度来指定某个宽度区间的网页布局。
超小屏幕（移动设备）    768px以下
小屏设备    768px-992px
中等屏幕    992px-1200px

宽屏设备    1200px以上

四、对比移动WEB开发

总结：

移动web开发和响应式开发都是现在主流的开发模式。
使用的都是流式布局，来适配不同设备。
由于终端设备的多样化，新建站的站点会优先用响应式来开发。