800、1280、1440、1600、1920
在<head></head>标签中，使用js
<script>
if(document.screen.width>=1680){
document.write('<link rel="stylesheet" href="css/css1680.css">')
}else if(document.screen.width>=1600){
document.write('<link rel="stylesheet" href="css/css1600.css">')
}else{
document.write('<link rel="stylesheet" href="css/css800.css">')
}
</script>
二、媒体查询
css3新特性
1、多个样式表
<link rel="stylesheet" media="screen and (max-device-width:1280px)" href="css/css1280.css">
<link rel="stylesheet" media="screen and (min-device-width:1280px) and (max-device-width:1680px)" href="css/css1680.css">
<link rel="stylesheet" media="screen and (min-device-width:1680px)" href="css/css1920.css">
2、一个样式表
@media screen and (min-width:1920px){大于1920px的样式}
@medie screen and (min-width:1680px) and (max-width:1920px){1680-1920的样式}
@media screen and (max-width:1680px){小于1680px的样式}
方法：根据浏览者的分辨率自动调用样式表1、新建两个样式表分别命名为：1024.css800.css（当然有更多分辨率，可以增加样式表）
2、在样式表中分别定义好图片作为网页背景。
3、新建一个网页文件，把下面代码复制过去。
<script language="JavaScript">
<!--
function test(){
var a=screen.width+".css"
//alert(a)
//测试变量a的值
document.getElementById("eric").href =a
}
//-->
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<title>无标题文档</title>
<link href="" rel="stylesheet" type="text/css" id="eric">
</head>
<body onLoad="test()">
</body>
</html>
搞定！
