background的属性详解二

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;
}