小编Joe*_*evy的帖子

通常,两个.labout跨度都是白色,两个.pabout跨度都是黄色.当盘旋在我身上时,整个短语都是黑色的.即当按钮的任何部分悬停在上面而不是单个跨度时,了解完全服务是黑色的.

<div id="inner">
    <a style="color:white" href="full-service/overview/" class="fs-button">
        <span class="labout">LEARN ABOUT</span>
        <span class="pabout"> FULL SERVICE</span>
    </a>                    
    <a style="color:white; vertical-align:middle;" href="diy/overview/" class="diy-button">
        <span class="labout">LEARN ABOUT</span>
        <span class="pabout">  DO IT YOURSELF</span>
    </a>
</div>

但是,对于我拥有的CSS,只有你悬停在上面的单个跨度变成黑色,而其他短语则没有.这是我的css:

a.fs-button {
    display: inline;
    background: #28353e;
    height: 26px;
    margin: 0 10px;
    width: 245px;
    float: left;
    font-family: 'asenine';
    text-decoration: none;
    font-size: 20px;
    text-align: center;
    vertical-align: middle;
    padding-top: 5px;
    position: absolute;
}

a span.pabout {
    color: #f6ec02;
}

.home-buttons a span.labout:hover {
    color: black;
}   

.home-buttons a span.pabout:hover {
    color: black; …