我有一个父组件，其中有两个子组件。所有三个组件都使用accordion-group。我的样式有一个类，如下所示，我希望这个类只应用于父组件。由于某种原因：没有对我不起作用。这个类应用于整个页面，所以子组件也得到它
类别

accordion-group :not(app-child){
    .panel-heading {
        height: 44px;
        display: flex;
        align-items: center;
        width: 100%;
        padding-left: 20px;
    }

    .panel-body {
        padding-top: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .panel-title {
        width: 100%;
    }
}

我的html

<accordian>
    <accordion-group>
       <div class="panel-heading"> 
          <div class="panel-title"> 
            <app-child> 
             <accordian>
              <accordion-group>
               <div class="panel-heading"> 
                <div class="panel-title"> 
                ...
                </div>
               </div>
              </accordion-group>
             </accordian>
            </app-child>
          </div>
       </div>
    </accordion-group>
   </accordian>

更新另一个简单示例
超文本标记语言

<div class="acc"> 
   <span class="acc">span1</span><br>
   <span class="acc">span2</span>
   <div>
      <span class="acc">span3</span><br>
      <span class="acc">span4</span>
   </div>
</div>

碳硫

div:not(div){
border:solid black;
}

我只想让span 1和span 2应用该类。