Question

是否可以不将CSS类应用于类中的特定元素？

例如：

<div className="container-fluid bg-2 text-center">
    <h3>LinkedIn</h3>
    <a target="_blank" href= {"https://www.linkedin.com"}><img src={linkedin} className={"linkedin"}/></a>
    <p>Please follow my LinkedIn account to get updated on my experiences and skills and join my network!</p>
</div>

在这段代码中，我想从容器类中排除img标记，这样CSS不会应用于该元素。我知道我可以只做同一个类的两个单独的div，然后将anchor标记放在中间，但是我想知道是否可以通过编程方式进行。

Answer 1

    div.dummy  :not(a):not(img) {
      background: black;
      color: white;
      font - size: 20 px;
      width:100%;
      height:50px;
      position:relative;
    }

    <div class="container-fluid dummy bg-2 text-center">
      <h3>LinkedIn</h3>
      <a target="_blank" href={ "https://www.linkedin.com"}>
        <img src={linkedin} class={ "linkedin"}/>
        </a>
      <p>Please follow my LinkedIn account to get updated on my experiences and skills and join my network!
      </p>
    </div>

您可以在上面的演示中看到，除了img标记之外，所有标记均受到影响。

尝试使用:not选择器

Read here咨询can i use

else的img有一个特定的CSS，它将覆盖您想要的任何CSS。

Answer 2

:: not（selector）选择器匹配不是指定元素/选择器的每个元素。

:not(.container>img) {
       background-color: blue;
       //your css here
    }

从Div的CSS类中排除元素

2 个答案: