如何用CSS样式来实现当鼠标放上去时会出现另一张背景图片呢
3个回答
展开全部
做好准备工作,把两张100px X 100px的图片合成 100 X 200 的。通过CSS图片定位来达到切换效果。存放在根目录 img\tupian.gif
<style>
#div_1{width:100px;height:100px;margin:0;padding:0;} 定义一个DIV方框
#div_1 ul,li{list-style:none;margin:0px;padding:0px;} 定义div_1中UL,LI
#div_1 li{float:left;margin:0;}
#div_1 a{
background:url(img/tupian.gif) no-repeat;width:100px;height:100px;display:block;
} 定div_1中链接背景样式等
#a1 a:hover,#a1 a:active{
background-position: 0px -100px;height:100px;
} 定义一个鼠标悬停状态
</style>
在BODY中
<div id="div_1"><ul>
<li><a href="#">首页</a></li>
<style>
#div_1{width:100px;height:100px;margin:0;padding:0;} 定义一个DIV方框
#div_1 ul,li{list-style:none;margin:0px;padding:0px;} 定义div_1中UL,LI
#div_1 li{float:left;margin:0;}
#div_1 a{
background:url(img/tupian.gif) no-repeat;width:100px;height:100px;display:block;
} 定div_1中链接背景样式等
#a1 a:hover,#a1 a:active{
background-position: 0px -100px;height:100px;
} 定义一个鼠标悬停状态
</style>
在BODY中
<div id="div_1"><ul>
<li><a href="#">首页</a></li>
展开全部
鼠标放上去的效果a:hover { .... }
鼠标点击后的效果a:visited {....}
被用户点击及被点击释放之间的样式
a:active{...}
大括号中内容可以参照1楼!
鼠标点击后的效果a:visited {....}
被用户点击及被点击释放之间的样式
a:active{...}
大括号中内容可以参照1楼!
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
a:hover { background:图片 width:xx ; height:xx ; }
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |