您的位置:首页 > 其它

div鼠标指向文字与背景变换

2012-09-06 09:58 309 查看
<style type="text/css">

<!--

body,td,th {

 font-size: 12px;

}

#rightmenu {

 margin: 0;

 padding: 0;

}

#rightmenu a {

 display: block;

 background: #BF3E18 url(images/vmenuarrow.gif)
no-repeat center left;

 color: #FFFFFF;

 padding: 5px 0 5px 19px;

 margin: 0 0 1px 0; 

 text-decoration: none;

}

#rightmenu a:hover {

 color: #000;

 background: #822C0F
url(images/vmenuarrowhover.gif) no-repeat center left;

}

-->

</style>

<div id="rightmenu"><a
href="http://sina.com.cn/jieeeee">花年记事</a><a
href="http://sina.com.cn/jieeeee">花年记事</a><a
href="http://sina.com.cn/jieeeee">花年记事</a><a
href="http://sina.com.cn/jieeeee">花年记事</a></div>





鼠标指向图片变换(也是背景)

.pus_01{ width:197px; height:197px; float:left;}

.pus_01 a.more{

 background:url(cp/c_01.jpg) no-repeat 0 0
#FFFFFF; color:#000000;

 width:197px; height:197px; display:block;
float:right;

 text-decoration:none; text-indent:-2000px;

 padding:0; line-height:0;}

.pus_01 a.more:hover{

 background:url(cp/c_001.jpg) no-repeat 0 0
#FFFFFF; color:#000000;}

---------------------------------------------------------------------------CSS样式

  <div
class="pus_01"><a href="#"
title="more"
class="more">moer</a></div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  div url float class c