关于响应式布局的要点

1.什么是响应式布局？

响应式布局就是根据设备的分辨率自动调整切换到你设定好的适应当前分辨率的布局方法

（比如：屏幕分辨率大于768时用一种布局方式，小于768时用另外的布局方法）

2.响应式布局的关键使用的是媒体查询,用法如下

@media(min-width:769px){

.........

}

@media(max-width:768px){

...........

}

3.因为响应式一般给容器指定的是百分比的宽度，所以，给容器指定margin属性时，会造成布局混乱，所以可以使用calc（）方法，用法如下

width:calc(50% - 10px);

ps:中间是运算符号“+”、“-”、“*”、“/”，书写的时候，符号开头和结尾都必须留有空格。

4.另外学习了正则css选择器

[class*=''col-]{

........

}

意思是选中所有class中包含col-的元素