html网页背景图片设置

背景颜色属性(background-color)
这个属性为HTML元素设定背景颜色，相当于HTML中bgcolor属性。

body {background-color:#99FF00;}
上面的代码表示Body这个HTML元素的背景颜色是翠绿色的。

演示示例

背景图片属性(background-image)
这个属性为HTML元素设定背景图片，相当于HTML中background属性。

<body style=”background-image:url(../images/css_tutorials/background.jpg)”>
上面的代码为Body这个HTML元素设定了一个背景图片。

演示示例

背景重复属性(background-repeat)
这个属性和background-image属性连在一起使用，决定背景图片是否重复。如果只设置background-image属性，没设置background-repeat属性，在缺省状态下，图片既横向重复，又竖向重复。

repeat-x 背景图片横向重复
repeat-y 背景图片竖向重复
no-repeat 背景图片不重复
body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:repeat-y}
上面的代码表示图片竖向重复。

演示示例

背景附着属性(background-attachment)
这个属性和background-image属性连在一起使用，决定图片是跟随内容滚动，还是固定不动。这个属性有两个值，一个是scroll，一个是fixed。缺省值是scroll。

body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:no-repeat; background-attachment:fixed}
上面的代码表示图片固定不动，不随内容滚动而动。

演示示例

背景位置属性(background-position)
这个属性和background-image属性连在一起使用，决定了背景图片的最初位置。

body {background-image:url(../images/css_tutorials/background.jpg);background-repeat:no-repeat; background-position:20px 60px}
上面的代码表示背景图片的初始位置距离网页最左面20px，距离网页最上面60px。

演示示例

背景属性(background)
这个属性是设置背景相关属性的一种快捷的综合写法，包括background-color, background-image, background-repeat, backgroundattachment, background-position。

body {background:#99FF00 url(../images/css_tutorials/background.jpg) no-repeat fixed 40px 100px}
上面的代码表示，网页的背景颜色是翠绿色，背景图片是background.jpg图片，背景图片不重复显示，背景图片不随内容滚动而动，背景图片距离网页最左面40px，距离网页最上面100px。

————————————————————————-

以下就是各个版面背景修改的代码，具体的操作在代码下方
<STYLE type=text/css>
.bodybox{background: url(大背景网址) repeat }
.bodybg{background:url(文章背景网址) repeat}
.bodybottom{background:url(页脚背景网址)}
.logo{background:url(页眉背景网址)}
.banner{background:url(大标题背景网址)}
.menu{background:url(菜单栏背景网址)}
.feeds .up { BACKGROUND: url(文章标题上翻背景网址)}
.feeds .down {BACKGROUND: url(文章标题展开背景网址) }
.feeds .function {BACKGROUND: url(文章评论背景网址)}
.feeds .page
{background:url(“正文文章页数图片地址”) no-repeat center;}

.callboard .up { BACKGROUND: url(公告栏上翻网址)}
.callboard .down { BACKGROUND: url(公告栏展开网址)}
.links .down { BACKGROUND: url(小标题展开网址)}
.links .up {BACKGROUND: url(小标题上翻图片网址)}
.calendar .mid {BACKGROUND: url(日历背景图网址)}
.label .mid {BACKGROUND: url(自定义面板背景网址)}
.links .mid {BACKGROUND: url(小标题背景网址)}
.links .more { BACKGROUND: url(More小图标网址) no-repeat WIDTH:50px;HEIGHT:18px}
.photo .mid {BACKGROUND: url(形象照片背景网址) }
.callboard .mid {BACKGROUND: url(公告栏背景网址)}
.gbook .up{background:url(“留言板标题栏上翻时的图片地址”) no-repeat;}
.gbook .down{background:url(“留言板标题栏下翻时的图片地址”) no-repeat;}
</STYLE>
可以自己去百度或google搜，喜欢的图片，点右键，选属性，将属性中的图片网址复制后替换（）中的内容即可，当然，添加的步骤还是：
１．将代码添加到新建的自定义画板的代码里（将显示代码前打勾，即可添加），保存
２．在定制我的首页中添加刚才创建的面板，之后保存
３．如果还有不清楚的，参照添加投票系统一文
4.将网址放到＂＂里也就是说正确的形式是：….:url(“加你的网址”)…
5.“大背景(body)”指的是整个博客的最大背景，由于中间部分被覆盖，所以显示的效果只是两边的部分(1024*768规格)。
“页眉背景(logo)”是指所在的横长条的背景。
“大标题背景(banner)”是指博客名字（如心晴客栈）所在的那部分的背景。
“菜单栏背景”是指“HOME…搜索┆帮助┆退出”等字所在的那个横长条的背景。
“文章标题上翻背景图片”指的是文章发表了之后文章标题的图片。
“小标题展开时的图片”指的是点击标题后出现标题后的后面的图片。
“小标题背景图片”指的是左边比如我的文章列表什么的背景图片。

下面是固定背景的代码：
<DIV>
<style type=text/css>
<!–
body{
background:url(图片url地址) #ffffff repeat scroll!important;
}
–>
</style>
</DIV>
此代码的操作说明：
１．操作同上
２．代码中的#ffffff表示背景颜色(白色)，可修改为你想要的背景颜色代码，具体的颜色编号去这里查找 http://www.yonghappy.com/1175
３．repeat表示图片平铺，不想平铺则改为no-repeat.
４．scroll表示图片随对象滚动.图片固定不滚动改为fixed.
５．!important表示这里的设置优先.不要将它去掉，否则有可能会引起冲突.造成显示不正常