Question

JS如何判断分辨率不同,调用不同的CSS文件具体怎么用，如下方法可行吗？

<link rel="stylesheet" type="text/css" id="sc" href="css/style.css"/>
<link rel="stylesheet" type="text/css" href="css/reset.css"/>
<link rel="stylesheet" type="text/css" href="fonts/fonts.css"/>

<script type="text/javascript">
window.onload=function(){
var sc=document.getElementById("sc");
var wrapper=document.getElementById("wrapper");
if(screen.width>2000) //获取屏幕的的宽度
{
sc.setAttribute("href","css/style.css"); //设置css引入样式表的路径

}
else{
sc.setAttribute("href","css/style2.css");
}
}
</script>

Answer 1

css3 @media 现在这个比较多

追问

现在我页面都写好了，就是在小分辨率下面显示不完整，这个整起来麻烦不嘛，最好能有个例子什么的最好了。我小白 嘿嘿。

追答

上面表示的是：当屏幕小于或等于600px时，将采用small.css样式来渲染Web页面。

二、最小宽度Min Width

上面表示的是：当屏幕大于或等于900px时，将采用big.css样式来渲染Web页面。

html的doctype得是

追问

现在我这边的情况是，我用html（不是html5写的），写了一个页面，但是不能自适应用的固定宽度，高度。现在我想让他自适应，就找了上面那种方法，根据屏幕尺寸来调用不用的CSS文件，可以调用了，但是有一个问题，页面有些图片是写在html里面的，我要怎么根据CSS不同来调用不同的图片呢。 你这种方法是要牛一点，但是我还是想我这种方法还能不能实现。

追答

jq
$(document).ready(function(){
if($(window).width()>2000){
$('head').append('<link rel="stylesheet" href="big.css" type="text/css" />');
}else{
$('head').append('<link rel="stylesheet" href="small.css" type="text/css" />');
}
});
这只能在一开始自适应，如果用户再调整就没用了。你不是用html5,你可以把doctype改了试试，因为差别不大。
用html5 css3的比较简单

追问

嗯 是比较简洁，但是还是有个html图片尺寸的问题存在嘛，调用的CSS不同了。但是html页面里面图片尺寸是固定了的嘛，就算是页面其它地方起了变化，图片还是不能跟着变呢。 兄弟这种情况怎么处理的呢。麻烦。谢谢了。

追答

？这是新问题？

追问

嘿嘿 不知道算不算。但是如果页面内容尺寸变了，图片尺寸得改变吧。但是图片又写在同一个html文件里面的。可不可以在CSS里面固定了图片的尺寸呢。小白一个大神见笑了。还望解答呀。我会加分的 麻烦

追答

加分？别闹
img{
width:
height:

}
你写的css?

追问

嗯 我这样做过，没起效果。这图片是banner轮换的那种。

追答

有js的吧，自己看着改

Answer 2

@media属性判断
@import加载

追问

能具体点嘛？亲 最好能有个例子，我小白 谢谢咯！

追答

http://www.pconline.com.cn/pcedu/sj/wz/html/0704/1004949.html 介个上面有详细的解释。去看看吧

Answer 3

我是来做任务得