关于页面自适应的问题

最新推荐文章于 2019-08-06 15:24:00 发布

violet_smy

最新推荐文章于 2019-08-06 15:24:00 发布

阅读量486

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/violet_smy/article/details/24720993

版权

CSS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

网页自适应的一些简单写法

比如网页要缩小

width: 100%;

min-width:1024px;

这句是让页面在大于1024px时跟着页面缩放，在小于1024px时固定住大小

但是这种写法对于IE不起作用，原因是IE把width当成min-width来对待，所以我们利用IE的特性来hack

#container{
width:100%;
min-width: 1024px;
width: expression(document.body.clientWidth < 1024? “1024px”: “100%” );
}

注意，这段只能加在body内的div上，不能直接加在body上。

需要加body，网上有人给出了方案

CODEvar d = document;
var winIE = (navigator.userAgent.indexOf(”Opera”)==-1 && (d.getElementById &&   d.documentElement.behaviorUrns))   ? true : false;
function bodySize(){
if(winIE && d.documentElement.clientWidth) {
sObj = d.getElementsByTagName(”body”)[0].style;
sObj.width = (d.documentElement.clientWidth<760) ? “760px” : “100%”;
}
}
function init(){
if(winIE) { bodySize(); }
}
onload = init;
if(winIE) { onresize = bodySize; }