用JS调用不同的CSS样式在不同分辨率下怎么搞哦，试了很多JS代码都不行
因为版面需要，所以我在一个DIV中用了margin,并且数值是-230PX00230px.所以在不同分辨率下面，这个DIV会改变，现在我针对各个分辨率都写出来正确的CSS...
因为版面需要，所以我在一个DIV中用了margin,并且数值是 -230PX 0 0 230px. 所以在不同分辨率下面，这个DIV会改变，现在我针对各个分辨率都写出来正确的CSS样式，就是要写一段JS代码检测屏幕的分辨率，然后调用相应的CSS，我的CSS在根目录下，请知道的人说说，给最高分，我弄好了，继续追加，反正我分多。先谢谢大家了。
fivetomic 兄你说的这个我都试过了，没有成功，当然最好是判断浏览器的，比如你的第二个我在网上看到资料 的，但是我试了没有成功，我的style.css文件是在根目录下的，最好请写一个示例的html文件出来，怎么调用的，变量修改的地方等。。。谢谢啦。。在线等着回答。。 展开
fivetomic 兄你说的这个我都试过了，没有成功，当然最好是判断浏览器的，比如你的第二个我在网上看到资料 的，但是我试了没有成功，我的style.css文件是在根目录下的，最好请写一个示例的html文件出来，怎么调用的，变量修改的地方等。。。谢谢啦。。在线等着回答。。 展开
展开全部
楼主，我看你的方法不靠谱，针对各个分辨率写CSS，现在电脑分辨率多达几十种，你难道写几十个样式，有16：9以下的分辨率，有16：10以下的分辨率，还有笔记本的分辨率。写一个万能的CSS才是王道。楼主还不如把问题说出来，大家想想办法。其实根据分辨率调用CSS时不难的，但我还是建议楼不要这么做
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
根据你的补充，我自己本机写了测试了：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<link href="" rel="stylesheet" type="text/css" />
<SCRIPT LANGUAGE="JavaScript">
<!--
if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
var IE1024="1.css";
var IE800="2.css";
var IE1152="1.css";
var IEother="2.css";
ScreenWidth(IE1024,IE800,IE1152,IEother)
}else{
if (window.navigator.userAgent.indexOf("Firefox")>=1)
{
//如果浏览器为Firefox
var Firefox1024="2.css";
var Firefox800="";
var Firefox1152="";
var Firefoxother="";
ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother)
}else{
//如果浏览器为其他
var Other1024="1.css";
var Other800="2.css";
var Other1152="1.css";
var Otherother="2.css";
ScreenWidth(Other1024,Other800,Other1152,Otherother)
}
}
function ScreenWidth(CSS1,CSS2,CSS3,CSS4){
if ((screen.width == 1024) && (screen.height == 768)){
setActiveStyleSheet(CSS1);
}else{
if ((screen.width == 800) && (screen.height == 600)){
setActiveStyleSheet(CSS2);
}else{
if ((screen.width == 1152) && (screen.height == 864)){
setActiveStyleSheet(CSS3);
}else{
setActiveStyleSheet(CSS4);
}}}
}
function setActiveStyleSheet(title){
document.getElementsByTagName("link")[0].href="style/"+title;
}
//-->
</SCRIPT>
</head>
<body>
<div id="box"></div>
</body>
</html>
这个够完整吧，当然里面写的是我测试的。你复制保存一个html先放电脑桌面上，然后在桌面上建立一个 style的文件夹，里面创建一个1.css和2.css
分别这样写
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<link href="" rel="stylesheet" type="text/css" />
<SCRIPT LANGUAGE="JavaScript">
<!--
if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
var IE1024="1.css";
var IE800="2.css";
var IE1152="1.css";
var IEother="2.css";
ScreenWidth(IE1024,IE800,IE1152,IEother)
}else{
if (window.navigator.userAgent.indexOf("Firefox")>=1)
{
//如果浏览器为Firefox
var Firefox1024="2.css";
var Firefox800="";
var Firefox1152="";
var Firefoxother="";
ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother)
}else{
//如果浏览器为其他
var Other1024="1.css";
var Other800="2.css";
var Other1152="1.css";
var Otherother="2.css";
ScreenWidth(Other1024,Other800,Other1152,Otherother)
}
}
function ScreenWidth(CSS1,CSS2,CSS3,CSS4){
if ((screen.width == 1024) && (screen.height == 768)){
setActiveStyleSheet(CSS1);
}else{
if ((screen.width == 800) && (screen.height == 600)){
setActiveStyleSheet(CSS2);
}else{
if ((screen.width == 1152) && (screen.height == 864)){
setActiveStyleSheet(CSS3);
}else{
setActiveStyleSheet(CSS4);
}}}
}
function setActiveStyleSheet(title){
document.getElementsByTagName("link")[0].href="style/"+title;
}
//-->
</SCRIPT>
</head>
<body>
<div id="box"></div>
</body>
</html>
这个够完整吧，当然里面写的是我测试的。你复制保存一个html先放电脑桌面上，然后在桌面上建立一个 style的文件夹，里面创建一个1.css和2.css
分别这样写
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
1.css里面写
#box{ width:400px; height:100px; background:#000000;}
2.css里面写
#box{ width:400px; height:100px; background:#ff0000;}
然后你打开你先前的那个html就可以看到效果了。
我是上面的FIVETOMIC，不知道为什么一次回答不了，还得分两次，满意的话采纳上面FIVETOMIC的答案，谢谢了：）
#box{ width:400px; height:100px; background:#000000;}
2.css里面写
#box{ width:400px; height:100px; background:#ff0000;}
然后你打开你先前的那个html就可以看到效果了。
我是上面的FIVETOMIC，不知道为什么一次回答不了，还得分两次，满意的话采纳上面FIVETOMIC的答案，谢谢了：）
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
-230PX 0px 0px 230px
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
