这是我想做的事情:
我有两个并排的图标,在它们下方有两个隐藏的span。当我将鼠标悬停在一个图标上时,我希望相应的span出现。
------------ HTML部分 -----------------
<span class="icons"><!--ICONS-->
<li class="oneLI">one</li>
<li class="twoLI">two</li>
</span>
<span class="popups">
<span class="one"></span>
<span class="two"></span>
</span>
--------------CSS 部分--------------
span.popups span.one,span.popups span.two{opacity:0;
span.icons:first-child:hover + span.popups span.one{opacity:1}
span.icons:last-child:hover + span.popups span.two{opacity:1}
显然这并不完全有效,我该如何只使用CSS来解决这个问题?