wlbk.net
当前位置:首页 >> Css鼠标悬停时,换图片 >>

Css鼠标悬停时,换图片

写了个例子: 给img标签加个属性:border="0"后,就不会有边框了 图片的高度和宽度可以不用设定,只是设置了鼠标的两种状态,切换的其实是图片的地址src

使用CSS :hover 伪类可以达到这个效果。 定义和用法 :hover 选择器用于选择鼠标指针浮动在上面的元素。 提示::hover 选择器可用于所有元素,不只是链接。 提示::link 选择器设置指向未被访问页面的链接的样式,:visited 选择器用于设置指向已...

这里的文字不现实,只显示图片 a{background:url(a.jpg) no-repeat left top;display:block;width:100px;height:100px;text-decoration:none;text-indent:-20000px} a:hover{background:url(b.jpg) no-repeat left top;}

不用那么麻烦,活用a标签就可以了 a.home {background:url(鼠标滑过之前的图片地址) no-repeat; width:100px; height:20px; display:inline-block;_float:left;} a.home:hover {background:url(鼠标滑过的图片地址) no-repeat; 首页 这样就可以...

用js实现,css没办法实现,用hover是不兼容得,因为根本就不是img的伪类

通常可以使用css样式的 :hover 选择器, 如示例div1。 也可以使用js来控制css样式,用js可以灵活加入其它效果(延迟显示、随机背景图), 如示例div2。 示例代码: Document.d1{width: 150px;height: 150px;}.d1:hover{ /*在这里使用hover 来改变...

代码如下: a:hover img { padding:0 5px 5px 0; background : #fff url(阴影图片) right bottom ; } 要求阴影是从左上向右下的光照的效果。其他光照效果可以自己改代码。

做好准备工作,把两张100px X 100px的图片合成 100 X 200 的。通过CSS图片定位来达到切换效果。存放在根目录 img\tupian.gif #div_1{width:100px;height:100px;margin:0;padding:0;} 定义一个DIV方框 #div_1 ul,li{list-style:none;margin:0px;p...

网站首页 | 网站地图
All rights reserved Powered by www.wlbk.net
copyright ©right 2010-2021。
内容来自网络,如有侵犯请联系客服。zhit325@qq.com