响应式数据及弹性布局

一、响应式数据的原理

1、响应式网站设计(Responsive web design)的理念集中创建页面的图片排版大小，可以智能的根据用户的行为以及使用设备的环境（系统平台，屏幕尺寸，屏幕定向等）进行相对应的自适应布局。
具体实现方式有很多种，包括弹性网格和布局图片，CSS媒体查询
原理：
动态的根据当前屏幕的宽度，动态的改变也买你盒子的宽度，盒子的显示或者隐藏。
2、HTML响应式布局实现
（1）viewport是网页默认的宽度和高度，上面这行代码的意思是：网页宽度默认等于屏幕宽度 （width=device-width），原始缩放比例（initial-scale=1）为1.0，即网页初始大小占屏幕面积的100%。

所有主流浏览器都支持这个设置，包括IE9。对于那些老式浏览器（主要是IE6、7、8），需要使用css3-mediaqueries.js。