css 自适应 @media

v2016 2018-4-10 3718

.abc{ height:300px; border:1px solid #000; margin:0 auto} 
@media screen and (min-width: 1201px) { 
.abc {width: 1200px}  

/* css注释:设置了浏览器宽度不小于1201px时 abc 显示1200px宽度 */ 

@media screen and (max-width: 1200px) { 
.abc {width: 900px}  

/* 设置了浏览器宽度不大于1200px时 abc 显示900px宽度 */ 

@media screen and (max-width: 901px) { 
.abc {width: 200px;}  

/* 设置了浏览器宽度不大于901px时 abc 显示200px宽度 */ 

@media screen and (max-width: 500px) { 
.abc {width: 100px;}  

/* 设置了浏览器宽度不大于500px时 abc 显示100px宽度 */

最新回复 (2)
  • v2016 2018-9-9
    2
    {display:none;}
  • C 2018-9-10
    3
    原生写法,挺好用