浏览器兼容--CSS

////不同浏览器,分辨率:

<link href="" rel="stylesheet" type="text/css" />

<script  type= "text/javascript"  language="JavaScript">
<!--
if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
//如果浏览器为IE
var IE1024="default.css";
var IE800="default.css";
var IE1152="default.css";
var IEother="default.css";
ScreenWidth(IE1024,IE800,IE1152,IEother)
}else{
if (window.navigator.userAgent.indexOf("Firefox")>=1)
{
//如果浏览器为Firefox
var Firefox1024="";
var Firefox800="";
var Firefox1152="";
var Firefoxother="";
ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother)
}else{
//如果浏览器为其他
var Other1024="";
var Other800="";
var Other1152="";
var Otherother="";
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>

////不同浏览器:
<script type ="text/javascript" language="javascript" >

if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
//如果浏览器为IE
document.write('<link rel=stylesheet type="text/css" href="style/default.css">')
}
else
{
if (window.navigator.userAgent.indexOf("Firefox")>=1)
{
//如果浏览器为Firefox
document.write('<link rel=stylesheet type="text/css" href="style/default2.css">')
}
else
{
//如果浏览器为其他
document.write('<link rel=stylesheet type="text/css" href="style/newsky.css">')
}
}
</script>

////不同分辨率:

 <script  type="text/javascript"  language="javascript" >

if (screen.width == 800)
{
document.write('<link rel=stylesheet type="text/css" href="style/css800.css">')
}
else {document.write('<link rel=stylesheet type="text/css" href="style/css1024.css">')}
 
</script>

/////////////////////////////////////////////////

CSS HACK :

background: orange; *background:green;_background:blue;

书写的顺序是firefox的写在前面,IE7的写在中间,IE6的写在最后面

/////////////////////////////////////////////////

 div#test { background-color :red; height: 330px;  width: 827px;  }
*+html div#test{background-color:blue; height: 330px; width: 827px;}s

*html div#test {background-color:green; height: 330px;  width: 827px;}
//第一句 Firefox 等可以正常识别,所以这些浏览器中呈红色;
//第二句只有 IE7 才能正确识别,而 IE6 和其他非 IE 核心浏览器不能,呈蓝色。

//第三句 IE6 能识别并执行,用于针对 IE6 独立写的样式,绿色;

posted on 2011-01-18 11:52  缘来  阅读(391)  评论(0编辑  收藏  举报

导航