来自一个 div 的 CSS 链接干扰了另一个？

Question

我有一个div #post 和一个div #nav。 Post 是一个 div，与 nav 无关。问题是 #post 使用的是 #nav 链接样式。

怎么了？

https://jsfiddle.net/2w92bLnf/

#post{
 width:100%;
 border:1px solid #D4DFE7;
 padding:15px;
 box-sizing: border-box;   
 margin-bottom:10px;
 background-color:#fff;
}
#post img{
 width:100%;
}


#nav a:link, a:visited, a:hover{
 text-decoration: none;
 border:1px solid #ddd;
 background-color:#fff;
 padding:3px;
 padding-left:6px;
 padding-right:6px;
 margin-right:5px;
}
#nav a:hover{
 background-color: #ff0000;
 color:#fff;
}
.selectnav{
 background: #ffff00;
}

<div id=post>
    <a href=#>test</a>
</div>

Answer 1

#nav a:link,
a:visited,
a:hover

应该是:

#nav a:link,
#nav a:visited,
#nav a:hover

否则 :visited 和 :hover 样式将应用于所有 a 元素，无论它们是否位于 中>#nav 元素。

JSFiddle demo .