美文网首页
响应式常用尺寸

响应式常用尺寸

作者: 江火渔枫 | 来源:发表于2016-09-06 17:02 被阅读160次

@media screen and (max-width:1024px){
.thumb-info{width: 728px;}
}
@media screen and (max-width:768px){
.thumb-info{width: 528px;}
}
@media screen and (max-width:640px){
.thumb-info{width: 368px;}
}
@media screen and (max-width:414px){
.thumb-info{width: 214px;}
}
@media screen and (max-width:384px){
.thumb-info{width: 182px;}
}
@media screen and (max-width:375px){
.thumb-info{width: 176px;}
}
@media screen and (max-width:360px){
.thumb-info{width: 168px;}
}
@media screen and (max-width:320px){
.thumb-info{width: 136px;}
}

脚本限定宽度
<meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<script> if(window.innerWidth>750)document.getElementById('viewportid').setAttribute('content','target-densitydpi=285,width=750,user-scalable=no');
if(window.innerWidth<750)document.getElementById('viewportid').setAttribute('content','target-densitydpi=320,width=750,user-scalable=no'); </script>

相关文章