我的链接<a> tag isn&#39;t responding to my CSS orders</a>

Question

我正在尝试让“开始新帖子”回应，因为我打算使用jquery来显示/隐藏表单。这是最好的方法吗？ “开始一个新帖子”没有响应我在CSS中做的任何样式。

这是我的HTML代码

<div id="start_new_post">
<a class="non_link" href="" alt="start a new post">Start A New Post</a>
</div>

这是我的CSS

#start_new_post {
    font-size: 2em;
    color: #C00;
    font-weight: bold;
    margin-top:30px;
    margin-left: 50px;

}
.non_link a:link {
    color: #C00;        
}
.non_link a:visited {
    color: #C00;    
}
.non_link a:hover {
    color: #C00;
    text-decoration:underline;
}

我试图用CSS错误地访问它吗？

Answer 1

您希望a标记包含class non_link，而不是a class元素下的所有non_link标记。
这样做：

a.non_link:link {
    color: #C00;        
}
a.non_link:visited {
    color: #C00;    
}
a.non_link:hover {
    color: #C00;
    text-decoration:underline;
}

Answer 2

.non_link:hover就是你想要的。

.non_link a:hover选择a .non_link的孩子。