Question

http://jsfiddle.net/suxedung/wH3nX/ [1] 我希望所有悬停文本都是白色但它不起作用！
这是我的HTML代码：

<div class="group_title">
    <a href="/be-positive-1">Be positive</a>    
    And you’ll acomplish everything
</div>

这是css代码：

.group_title {
width:220px;
height:55px;
text-align:center;
font-size:11px;
color:#999999;
background: #f6f6f6;

}
.group_title a{
    display:block;
    padding-top: 15px;
    text-decoration:none;
    font-size:12px;
    color: #444444;
    font-weight:bold;
    text-transform:uppercase;


.group_title:hover {
    width:220px;
    height:55px;
    color:#FFFFFF;
    text-align:center;
    font-size:11px;
    background: #23abf1;
    cursor: pointer;    
}
 .group_title a:hover{   
    display:block;
    padding-top: 15px;
    text-decoration:none;
    font-size:12px;
    font-weight:bold;
    text-transform:uppercase;
    color:#FFFFFF;
}

Answer 1

您的CSS格式不正确。

您错过了}部分的结束括号.group_title a {。

我还在以下示例中更新了CSS以应用所需的效果： http://jsfiddle.net/wH3nX/10/

.group_title:hover,
.group_title:hover a {
    color:#FFFFFF;
    background: #23abf1;
    cursor: pointer;
}

我删除了任何错误的更改，并将效果应用于<div/>和<a/>元素。

Answer 2

我已经更改了CSS请检查并更新

http://jsfiddle.net/wH3nX/13/

a:hover   {color:red;}

Answer 3

我现在就回答。

所以这是我添加的CSS。当鼠标悬停在div时，所有文字都会变为白色。使用.group_title:hover a我们可以选择a并在我们将鼠标悬停在其父级上时更改其颜色。

CSS：

.group_title:hover {
    color:#FFFFFF;
    text-align:center;
    font-size:11px;
    background: #23abf1;
    cursor: pointer;
}
.group_title:hover a {
    color:#FFFFFF;
}

DEMO HERE

Answer 4

您的.group_title a { ... }错过了结束括号。这是因为下一个CSS部分不起作用。

当使用css为所有子div设置鼠标时更改文本颜色

4 个答案:

CSS：