我知道一个简单的问题,但是用鼠标悬停在菜单上时,文本颜色没有改变。我知道我错过了一个地方。但是我想帮你。这是演示页面链接:CodePenio
菜单,指向更改背景色,但文本颜色不变。当鼠标在菜单上时,应更改具有背景色的文本颜色。
HTML:
<div tabindex="0" class="sd">
<ul class="eddel">
<li><a class="stdelete" href="#" id="<?php echo $msg_id;?>" title='Delete update'>Sil</a></li>
<li><a href="#">Düzenle</a></li>
</ul>
</div>
CSS:
.eddel {
border:1px solid #d8dbdf;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-image: rgba(235,235,235,1);
background-image: -webkit-linear-gradient(top, #2cbdf2 0%,#fafafa 0%,#f5f5f5 100%);
background-image: -moz-linear-gradient(top, #2cbdf2 0%,#fafafa 0%,#f5f5f5 100%);
background-image: -o-linear-gradient(top, #2cbdf2 0%,#fafafa 0%,#f5f5f5 100%);
background-image: -ms-linear-gradient(top, #2cbdf2 0%,#fafafa 0%,#f5f5f5 100%);
background-image: linear-gradient(top, #2cbdf2 0%,#fafafa 0%,#f5f5f5 100%);
-webkit-box-shadow: rgba(128,128,128,1) 0px 0px 0px 0px, inset rgba(255,255,255,1) 0px 0px 0px 0px;
-moz-box-shadow: rgba(128,128,128,1) 0px 0px 0px 0px, inset rgba(255,255,255,1) 0px 0px 0px 0px;
box-shadow: rgba(128,128,128,1) 0px 0px 0px 0px, inset rgba(255,255,255,1) 0px 0px 0px 0px;
padding:0;
width:80px;
margin-top: 15px;
margin-left: -50px;
padding-top: 4px;
padding-bottom:4px;
}
.eddel a {
width:80px;
height:25px;
text-decoration:none;
font-family:'lucida grande',tahoma,verdana,arial,sans-serif;
font-size:13px;
color:#000;
}
/* arrow for the expanding part */
.eddel:after {
content: "";
position: absolute;
top: -9px;
left: 47px;
border-style: solid;
border-width: 0 7px 8px;
border-color: #d8dbdf transparent;
display: block;
width: 0;
z-index: 0;
}
.eddel:before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 7px 8px;
border-color: #fafafa transparent;
display: block;
position: absolute;
top: -8px;
left:47px;
z-index:1;
}
.eddel li {
cursor:pointer;
list-style-type: none;
white-space: nowrap;
width:80px;
height:25px;
text-align:left;
line-height:25px;
text-indent:5px;
padding:0;
}
.eddel li:hover {
background:#3b5998;
width:80px;
height:25px;
padding:0px;
margin:0px;
cursor:pointer;
color:#FFF;
}
.sd {
text-align: left;
}
最佳答案
只需添加:
.eddel li:hover a {
color: #FFF;
}
到你的CSS