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，例如＆＃34; Batting Cages＆＃34;元素但不适用于＆＃34;人造草坪＆＃34;元素。怎么做？

Answer 1

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

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

Answer 2

这是我理解你需要的：

    ul li ul li:not(:first-child):not(:last-child),
    ul li ul li:not(:first-child):not(:last-child) a{
        background:#64FFDA;
        width:100px;
    }
    a{
        text-decoration:none;
        color:#333;
    }

ul li ul li:not(:first-child):not(:last-child),
ul li ul li:not(:first-child):not(:last-child) a{
    background:#64FFDA;
    width:100px;
}
a{
    text-decoration:none;
    color:#333;
    width:100px;
}

<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>

JSFiddle

中的代码

Answer 3

您可以为元素创建特定的ID。例如，

<li><a href="#" id="a">Artificial Turf</a></li>

不建议

.class，因为id更独特。每个ID只能使用一次。

Answer 4

你可以在上面放一个课程。

赞<a href="#" class="class name">Batting Cages</a>

并按照您想要的方式进行编辑

看这里http://jsfiddle.net/6ahahm08/2/

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

4 个答案: