我想實(shí)現(xiàn)點(diǎn)擊“我的淘寶”，出現(xiàn)下拉列表，里面有兩個超鏈“已買到的寶貝“和“已賣出的寶貝“，html如下：

<li class="sn-menu-dropdown"><a href="###">我的淘寶<span class="caret"></a>
    </span>
    <ul class="dropdown-content">
        <li><a href="###">已買到的寶貝</a>
        </li>
        <li><a href="###">已賣出的寶貝</a>
        </li>
    </ul>
</li>

我想用css實(shí)現(xiàn)，方法是:

.sn-menu-dropdown:hover{
    text-decoration: underline;
    cursor: pointer;
    background-color: #fff;
}
.dropdown-content{
    display:none;
}
.sn-menu-dropdown:hover .dropdown-content{
    display:block;
}

問題是，當(dāng)我這樣寫，.dropdown-content的樣式也全部變成.sn-menu-dropdown:hover的樣式了，而且我給.sn-menu-dropdown:hover .dropdown-content設(shè)置樣式也改不掉，這是為什么呢？卡了超級久，可能是鉆牛角尖了，請幫忙解答一下，謝謝！