关于响应式布局

    响应式布局的原理就是通过@media这个标签（媒体查询），来对页面窗口不同尺寸时候应用不同的样式。

@media screen and (max-width:300px){  div{ background:red;width:200px }  }

    当屏幕宽度最大尺寸小于等于300px时，div元素的宽度为200px。

注意：

元素的样式可能会叠加，应注意先后顺序。

响应式布局的调用可以直接写在css文件里面，另外一种可以通过link调用，需要注意的是link的写法有所不同

<link href=http://www.baidu.com/main.css" media="screen and (max-width:300px) ">