Question

我想找到我所有元素的前一个同级并更改其颜色。下面是一个示例：

    <ul>
        <li> 1
        <li>  2
        <ul>
            <li> 3
            <li> 4
            <ul>
                <li> 5
                <li> 6
            </ul>
         </ul>
         <li>  7
        <ul>
            <li> 8
            <li> 9
            <ul>
                <li> 10
                <li> 11
            </ul>
         </ul>
    </ul>

根据示例，我希望节点2、4、7、9受CSS / SASS影响。我们没有元素的任何类，也不能使用任何脚本。

Answer 1

就像Arkellys已经指出的那样，CSS / SASS中没有实际的“上一个同级”选择器。

但是有一个+选择器（相邻的同级组合器）。也许您可以尝试这样做，因为在您的示例中，它看起来有点像您想为每个列表选择第二个li。

https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator

ul > li {
  color: black;
}

ul > li + li {
  color: red;
}

<ul>
    <li>1</li>
    <li>2
        <ul>
            <li>3</li>
            <li>4</li>
            <ul>
                <li>5</li>
                <li>6</li>
            </ul>
        </ul>
    </li>
    <li>7
        <ul>
            <li>8</li>
            <li>9
                <ul>
                    <li>10</li>
                    <li>11</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

Answer 2

您可以使用

Christmas

CSS中是否有确切的上一个节点？

2 个答案: