html - 鼠标悬停文字颜色不变

Question

我知道一个简单的问题，但是用鼠标悬停在菜单上时文本颜色没有改变。我知道我错过了一个地方。但我想帮助你。这是演示页面链接: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;
}

Answer 1

只需添加:

.eddel li:hover a {
    color: #FFF;
}

到你的 CSS