响应式布局

要使用响应式布局首先需要在head中添加meta 例如<meta name = “viewport” content = “width = device - width”,initial-scale = 1.0">;
上述的view中的content可以有4个属性，分别为：
width = device-width 宽度等于当前设备宽度；
initial-scale = 1.0 初始缩放比例为1.0；
minimun-scale 允许用户缩放到最小比例 默认值为1.0；
maximun-scale 允许用户缩放到最大比例 默认为1.0；
user-scalable 用户是否可以手动缩放，默认值是no；
所以当你需要使用响应式布局的时候只需要把这串代码复制到head里面就可以了。

然后就是响应式布局需要从最小界面开始写，因为大的界面会继承小界面中的css属性
你在css属性中需要用@media screen and（min-width:980px）或者@media screen and (max-width:980px )
min··· 的意思是屏幕可视窗口尺寸大于480像素时的样式
max···的意思是屏幕可视窗口尺寸小于480像素时的样式
当你需要几块样式就分几块，把对应块的样式写入到里面就可以了。注意需要从小块开始写，大块会继承小块中的css样式，你在写大块的时候只需要写你需要改变的样式就可以了。