Question

我希望我的文字为深灰色（＃232323），然后在悬停时将其更改为橙色（＃f66511）并带下划线。

看着我的jsfiddle，我的代码中缺少什么：

http://jsfiddle.net/huskydawgs/brwb2r7a/9/

这是我的HTML：

    <div id="wrapper-landing">
    <div id="wrapper-icons">
        <div class="icons_row">
            <div class="icons_cell1 greyBoxOnHover">
                <a href="http://en.wikipedia.org/wiki/Apple"><img alt="Gala" height="140" src="http://www.clipartbest.com/cliparts/acq/ezj/acqezjKcM.jpeg" style="display:block; margin:0 auto;" width="140" /> </a>
                <p class="video-title rtecenter">
                    <a href="http://en.wikipedia.org/wiki/Apple">Wasington Apples:<br />Gala</a></p>
            </div>

</div>

CSS：

#wrapper-landing {
    width: 916px;
    margin: 0 auto 50px auto;
    padding: 0;
}

.rtecenter {
    text-align: center;
}

#wrapper-icons {
    position:relative;
    width:100%;
    border: none;
    margin: 35px 0 0 0;
}

.icons_row {
    height:100%;
    white-space:nowrap;
    }

.icons_cell1, .icons_cell2, .icons_cell3, .icons_cell4 {
    height:100%;
    width:25%;
    display:inline-block;
    white-space:normal;
    padding-top:15px;
    }

    .greyBoxOnHover:hover {
    background-color: #e2e3e4;
}

#wrapper-landing p.video-title {
    color: #232323;
    font-size: 12px;
    line-height: 12px;
    text-align: center;
}

#wrapper-landing p.video-title a {
    text-decoration: none;
}

#wrapper-landing p.video-title hover {
    text-decoration: underline;
    color: #f66511;
}

Answer 1

当您的悬停应为#wrapper-landing p.video-title hover

时，您的悬停时间为#wrapper-landing p.video-title a:hover

您错过了:和a选择器。

Answer 2

悬停为:hover，最后一个CSS定义必须为

#wrapper-landing p.video-title a:hover
                                ^

Answer 3

#wrapper-landing p.video-title a:hover {
    text-decoration: underline;
    color: #f66511;
}

你忘记了:

如何在悬停链接时将文本设置为深灰色然后橙色？

3 个答案: