首页 计算机

自适应常用css代码

发布时间:2017年02月27日 评论数：抢沙发 阅读数：4062

自适应能让你的网站在pc端和手机端都能完美的展示你的网站，下面就列出几个常用语句: 

@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宽度 */