在css中使用@media screen 通过检索宽度 对应改变html中class的css属性。
1280分辨率以上(大于1200px)
@media screen and (min-1200px){
.content{ 1100px; height:500px;}
.left{500px;hegith:1000px;background:#000;}
.right{500px;hegith:1000px; marigin-left:100px; background:#000;}
}
1100分辨率(大于960px,小于1199px)
@media screen and (min- 960px) and (max- 1199px) {
.content{ 1100px; height:500px;}
.left{500px;hegith:1000px;background:#666;}
.right{500px;hegith:1000px; marigin-left:100px; background:#666;}
}
标黄位置,当尺寸大于1200像素时候 HTML中的.left .right背景色会显示黑色
当尺寸在960~1199像素之间 HTML的.left .right 背景色会显示灰色