例如:
页面上有一个
原本背景图为img1.png,当鼠标滑过则换为img2.png.
在CSS中这样定义
.div_style:hover{
background:
url("img2.png")
//这是改变背景色
background-repeat:
no-repeat
//这是让背景色不平铺
color:
red
//这是让字体变为红色
}
或者用
.div_style:hover{
background-image:
url("img2.png")
//这是改变背景色
background-repeat:
no-repeat//这是让背景色不平铺
color:red
//这是让字体变为红色
}
有很多方法,给你提供两种简单的1、在dreamweaver中,在“插入”菜单中有一个“图像对像”——“鼠标经过图像”,然后,在对话框选择两张图片就行了
2、利用css中的hover
hover
img {margin:*
*
*
*
}
*表示新的位置
按照你这样的布局是要配合js才可以的,还有你的html代码有点问题,不符合规范,一般都是<li>包含<a>的,你为什么不从html上解决呢?
像这样
<ul class="no_style_ul"><li class="index"><a href="">首页</a></li>
</ul>
然后css像下面这样
<style>.no_style_ul li.index{ float:leftwidth:宽height:高background:url(你的那张ico背景图) left center no-repeatpadding-left:你那张ico的宽+5px}
.no_style_ul li.index:hover{background:url(变了颜色的ico背景图) left center no-repeat}
</style>
这样就解决了
希望对你有所帮助!