css - 如何从选择中删除第一个和最后一个元素？

Question

我想为 li 元素设置边距:

 <ul class="dropdown">
    <li class="menuppal"><a href="#">Administration</a>
        <ul>
             <li><a href="#">Artificial Turf</a></li>
             <li>
                <a href="#">Batting Cages</a>
                <ul>
                    <li><a href="#">Indoor</a>
                        <ul>
                            <li><a href="#">Garden</a></li>
                        </ul>
                    </li>
                    <li><a href="#">Outdoor</a></li>
                </ul>
             </li>
             <li><a href="#">Benches &amp; Bleachers</a></li>
             <li><a href="#">Communication Devices</a></li>
             <li><a href="#">Dugouts</a></li>
             <li><a href="#">Fencing &amp; Windscreen</a></li>
             <li><hr></li>
             <li><a href="#">Floor Protectors</a></li>
             <li><a href="#">Foul Poles</a></li>
             <li><a href="#">Netting</a></li>
             <li><a href="#">Outdoor Furniture</a></li>
             <li><a href="#">Outdoor Signs</a></li>
             <li><hr></li>
             <li><a href="#">Padding</a></li>
             <li><a href="#">Scoreboards</a></li>
             <li><a href="#">Shade Structures</a></li>
             <li><a href="#"> - VIEW ALL - </a></li>
        </ul>
    </li>
    ...
 </ul>

我想为“击球笼”元素等 li 元素设置 margin-top 和 margin-bottom，但不为“人造草坪”元素设置 margin-top 和 margin-bottom。如何做到这一点？

Answer 1

你只需要使用 css 规则 li:not(:first-child) 即可达到此目的。这是一个简单的示例。 Jsfiddle

.dropdown li:not(:first-child):not(:last-child)
{
    margin-top:10px;
    background:red;
}