如何使用css选择第一个2>元素

您好，我想应用css的前两个元素(一，二)，相邻的第一< p>元件。

<div class="one">
    <ul>
        <p>
            <li>One</li>
            <li>Two</li>
        <p>
        <li>Four</li>
        <li>Five</li>
    </ul>
</div>

以下应用于所有4 li元素

.one ul p:nth-child(odd) ~ li {
    background: lightsteelblue;
}

解决方法

对于第一个2 li元素在ul p try：

.one ul li:nth-child(-n+3){
    // your style
}

见jsfiddle

和其他伙伴一样：你有无效的标记。

如果删除p元素，请尝试：

.one ul li:nth-child(-n+2){
    // your style
}

参见jsfiddle

更新：我的建议是使用另一个ul而不是p：所以你有有效的标记和相同的结果：

HTML

<div class="one">
    <ul>
        <li>0</li>
        <li>
            <ul>
                <li>One</li>
                <li>Two</li>
                <li>3</li>
            </ul>
        <li>
        <li>Four</li>
        <li>Five</li>
    </ul>
</div>

CSS：

.one ul {
    padding: 0;
    list-style-type: none;
}
.one ul ul li:nth-child(-n+2){
    // your style
}

Updated jsfiddle

注意：作为最后一个注释，如果你只有两个特殊的li元素，为什么不能简单地定义一个类名…< li class =“bold”>简单

ul li.bold {
    // your style
}

原文地址：https://www.jb51.cc/css/220999.html