实现网页中某一块随鼠标的over和out变换背景的方法网上很多了，但由于要兼容IE7、IE6、FF，实现起来就会发现很多的问题了。经过实际使用，总结如下：

1、最传统的办法：
     <div onMouseover="this.style.backgroundColor='#f0f0f0'" onMouseOut="this.style.backgroundColor='#fff'" >***</div>
    该方法的兼容性很好了，当实现复杂效果的时候也是可以胜任的
    注：可以将CSS中的设置移植到其中的JS语句中，但要注意，CSS中的‘-’必须去掉，而且除开头单词外后面所有单词首字母大写，这是css规则中js表达式写法的通用规则，如backgroundImage='***'
    大家注意了没有，像这样写网站页面的话，代码就会看上去很长、很杂乱，和网页程序与页面分离的原则也是不符合的，下面就介绍其他几个比较先进的方法。

2、利用CSS中hover实现
     <style type="text/css">
    div:hover {background:url(***) #666 ...;}
    </style>
    这种方法是最简单的，对IE7、FF有效，但是对于顽固的IE6，没有作用

3、利用CSS的expression实现
      <style type="text/css">
      div{
          event:expression(
           onmouseover = function() {
              this.style.backgroundColor='#f0f0f0';
              },
         onmouseout = function() {
             this.style.backgroundColor='#ffffff'
             }
          )
        }
     该方法将JS写入CSS中，对IE有效，但FF失效，现在很多老鸟就是同时用2、3两个方法定义CSS，实现兼容性的，但在使用中我发现一个让人头痛的问题：
    你看啊，我们写CSS的时候肯定会把相同的CSS内容先定义出来，让后用expression定义变化的部分，但是，这样不行，同一个CSS类中不允许定义同expression定义相同的部分，比方说上面一个实现背景色变换的效果中，如果在expression外边，另外加上一个background-image:url(***); 或其他background的项目，在IE6中运行，就会让电脑死过去，哎，万恶的IE6，我在做网站的时候有一半的时间用在它身上了。。。

    看了以上描述，不知大家有收获否，希望你能写一个又简单，又好用的方法来实现这个效果，好自为之！！！