css - 使用 CSS 的多元素翻转

Question

当滚动列表项时，我需要让 div 显示 {border-bottom:solid 2px #F63}。我玩过 .whatever:hover .whatever { 但一无所获。有什么建议吗？

Answer 1

在没有看到您的 CSS/HTML 的情况下，很难/不可能发布解决方案。但是正如@James Khoury 在评论中提到的，您需要将 div 放在 li 中。所以像这样...

<ul>
    <li class="first">First
        <div class="first">
            First
        </div>
    </li>
    <li class="second">Second
        <div class="second">
            Second
        </div>
    </li>    
</ul>

CSS

div{width:50px; height:50px; 
    border:1px solid blue; 
    margin:1em;}

li a{display:block;}

li.first:hover div.first, li.second:hover div.second{
    border-bottom:solid 2px #F63;}

http://jsfiddle.net/jasongennaro/6rjd9/