Html 如何仅选择元素而不选择其子元素？

假设我有一个带有

id=“main”

的

div

，它包含多级随机元素随机元素：

 <div id="main">
    Main text
    <div>Random element
         <a>Random element
            <p>Random element</p>
         </a>
    </div>
 </div>

正文
随机元素
随机元素
随机元素

---

如何仅针对

#main

的内容，而不针对其所有子项，即

的“主文本”

在这种情况下，为了正常工作，您应该对HTML结构进行一些更改。因此，使用CSS选择器，您可以正确地选择目标。大概是这样的：

HTML:

---

在这种情况下，为了正常工作，应该对HTML结构进行一些更改。因此，使用CSS选择器，您可以正确地选择目标。大概是这样的：

HTML:

使用

#main

只能选择顶级元素，但子元素继承了一些属性。例如，尝试在

#main

上设置边框-它不会应用于所有子元素。使用

#main

时，您仅选择顶级元素，但子元素继承了一些属性。例如，尝试在

#main

上设置边框-它不会应用于所有子项。

<div id="main">
    <p>Main text</p>
    <div class="random">
        <p>random text</p>
        <p>random text</p>
        <a href="#">
            <p>random text</p>
        </a>
    </div>
</div>

#main > p {
    color: red;
}