下面的代码有效(让我们说情况1)

<div>
        <a href="#" id="TAMIL">TAMIL</a>

        <span id="subheader1">
           <a href="#" >NEWS</a>
           <a href="#" >AUDIO</a>
        </span>
     </div>


<style="text/css>"
#subheader1{
    display: none;
}
#TAMIL{
    display: block;
}
#TAMIL:hover + #subheader1{
    display:block;
}
</style>


但不是这个(假设情况2)

<div>
        <a href="#" id="TAMIL">TAMIL</a>
        <a href="#" id="TELUGU">TELUGU</a>
        <span id="subheader1">
           <a href="#" >NEWS</a>
           <a href="#" >AUDIO</a>
        </span>
     </div>

     <style="text/css>"
#subheader1{
    display: none;
}
#TAMIL{
    display: block;
}
#TAMIL:hover + #subheader1{
    display:block;
}
</style>


为什么?请帮我。
当我仅添加另一个超链接时,为什么它不起作用?
这是http://jsfiddle.net/cor6bay6/1/

最佳答案

+相邻兄弟选择器要求相邻兄弟是紧随其后的下一项。

在您的情况下,您需要通用的同级选择器。

#TAMIL:hover ~ #subheader1{
    display:block;
}


The 30 CSS Selectors you Must Memorize

关于html - 当我在div中添加其他超链接时,为什么以下html和css悬停代码不起作用?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33145197/

10-14 20:38
查看更多