Question

所以我有一个这样的页面：

<body>
    <ul>
        <li><span class="first">First</span></li>
        <li><span class="second">Second</span></li>
        <li><span class="third">Third</span></li>
        <li><span class="fourth">Fourth</span></li>
    </ul>
</body>

我想改变＆＃34; li＆＃34;的风格。仅在第一个和第二个范围内的标签。

我试过这个.first,.second li{margin-left:10px;}，但它没有用。

Answer 1

逗号需要分隔COMPLETE元素路径：

.first  li, .second li
{margin-left:10px;}

我已经浪费了足够的时间来解释为什么我没有提到你的不正确的格式，我此时也可以纠正你;

<body>
    <ul>
        <li class="first">First</li>
        <li class="second">Second</li>
        <li class="third">Third</li>
        <li class="fourth">Fourth</li>
    </ul>
</body>

CSS：

li.first, li.second {
    margin-left:10px;
}

如果我们真的要去这个兔子洞并教授代码，不妨提一下这可以完全没有课程：

ul li:nth-child(1), ul li:nth-child(2)
{
    margin-left:10px;
}

Answer 2

li必须跟随每个父元素，您不能将父母组合在一起，然后期望孩子适用于每个父元素。您所要求的是将样式应用于li元素的所有class=second，以及class=first的所有元素，而不是所有li的元素是具有class=first

的元素的子元素

.first li, .second li { margin-left:10px }

https://jsfiddle.net/udnjqqkh/

Answer 3

.first li {margin-left：10px;} .second li {margin-left：10px;}

更改仅在有用元素中的标记样式

3 个答案: