通过css：background-image语句设置背景。
background-image 属性会在元素的背景中设置一个图像。根据 background-repeat 属性的值，图像可以无限平铺、沿着某个轴（x 轴或 y 轴）平铺，或者根本不平铺。初始背景图像（原图像）根据 background-position 属性的值放置。
（1）相对的文件位置：
（2）测试代码：
测试效果：
扩展资料：
background-image 属性为元素元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。
默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。
提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。
参考资料：百度百科--CSS background-image
方法：根据浏览者的分辨率自动调用样式表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>
搞定！
你说底下的绿色？貌似这不是在header的背景色，估计是设在body里的；如果只是修改header的背景色，那么你直接加颜色就是了例如：background:url(images/warp.gif) center top no-repeat #666666最后教你个最快修改代码的方式，你可以用火狐或者360浏览器的代码查看工具(按F12)，查看你所要修改的部分的css，先在浏览器的插件中进行修改看看效果，然后就直接去文件中修改，浏览器插件会显示你所选择的css是在哪个文件的哪一行的，找起来很快
