background的属性详解2

在建设网站的过程中，有时难免会要用js来控制css,其实这是十分简单的看下面的例子。
html:<div id="my_div" style="background-color:red">js控制css</div>
js:document.getElementById("my_div").style.backgroundColor="red"

其实就是用style对象访问css属性，值得注意的是样式属性的写法在css里是background-color,但是在js里就是backgroundColor,一般情况是把"_"去掉，第二个字母用大写。

如果用的是外联样式表，就用currentStyle对象代替style对象。如：
document.getElementById("my_div").currentStyle.backgroundColor="red"


//-----------------------------------------
<div class="main_bread">
<div class="main_bread_left">
<ul>
<li>我的岗位</li>
</ul>
</div>
<div class="main_bread_right"><a href="javascript:history.go(-1);">返回上一页</a></div>
</div>

注意下面的图片是X方向平铺，位置是左上，并且是透明的
.main_bread_left {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background: url("../../images/bread_bg.jpg") repeat-x scroll left top transparent;
border-color: #CCCCCC #CCCCCC -moz-use-text-color;
border-image: none;
border-style: solid solid none;
border-width: 1px 1px medium;
float: left;
height: 30px;
width: auto;
}

//下面的不需要repeat,只1次就足够了，当然了也可以定义宽度的
.main_bread_left ul li.line {
background: url("../../images/bread_bg2.jpg") repeat scroll 0 0 transparent;
padding: 0;
width: 7px;
}