如何在CSS中选择同级的第一个孩子

Question

我创建了几个具有不同类的子元素，我需要选择具有特定类名的第一个子元素，这是另一个具有不同calssname的子元素的兄弟。如何在某些特定的同级后选择所有的第一个和最后一个孩子？

我试图选择最后一个孩子和第一个孩子，但只工作了最后一个孩子，未选择第一个孩子

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <h1>hello</h1>
    <div class="parrent">
        <div class="child2">child2</div>
        <div class="child1">child1</div>
        <div class="child2">child2</div>
        <div class="child2">child2</div>
        <div class="child2">child2</div>
        <div class="child1">child1</div>
        <div class="child1">child1</div>
        <div class="child2">child2</div>
        <div class="child2">child2</div>
    </div>
</body>
</html>

CSS

.parrent>div {
    color: green;
}

.child1 ~ .child2:first-child {
    color: red;
}

.child1 ~ .child2:last-child {
    color: red;
}

我希望选择.child2的所有第一个和最后一个孩子，它们与.child1保持同级（留在后面）>

但是我得到了：

我创建了几个具有不同类的子元素，我需要选择具有特定类名的第一个子元素，这是另一个具有不同calssname的子元素的兄弟。如何...

Answer 1

0
投票

没有选择器可以做到这一点。

如何在CSS中选择同级的第一个孩子

问题描述投票：0回答：1

1个回答

最新问题

如何在CSS中选择同级的第一个孩子

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1