如何只显示一个同名的类

Question

在我的代码中

<ol class="items">            
    <li class="item">
       <span class="filter-label">Category</span>
       <span class="filter-value">Fashion</span>                                                                                                                                                    
       <a class="action remove" href="https://www.marketplacedemo.store/online-store?cat=226" title="Remove Category Fashion">
           <span>Remove This Item</span>
       </a>                                                                    
    </li>            
    <li class="item">
        <span class="filter-label">Category</span>
        <span class="filter-value">Deal of day-Home</span>                                                                                                                               
        <a class="action remove" href="https://www.marketplacedemo.store/online-store?cat=109" title="Remove Category Deal of day-Home">
           <span>Remove This Item</span>
         </a>                                               
    </li>
</ol>

在这里，我只想显示一个类别，其余的所有类别都需要显示:现在没有，我已经尝试过了

.filter-label{
    display:none;
}
.items:nth-of-type(1) >.filter-label:first-child {
  display:block;
}

但这是行不通的。

我怎样才能只显示一个类别？任何帮助都是非常感谢的

Answer 1

您可以使用:not选择器来实现这一点。

​

.items li:not(:first-child) .filter-label {
  display: none;
}

<ol class="items">            
    <li class="item">
        <span class="filter-label">Category</span>
        <span class="filter-value">Fashion</span>                                        
        <a class="action remove" href="https://www.marketplacedemo.store/online-store?cat=226" title="Remove Category Fashion">
          <span>Remove This Item</span>
        </a>                                                                    
    </li>            
    <li class="item">
        <span class="filter-label">Category</span>
        <span class="filter-value">Deal of day-Home</span>                   
        <a class="action remove" href="https://www.marketplacedemo.store/online-store?cat=109" title="Remove Category Deal of day-Home">
           <span>Remove This Item</span>
        </a>                                               
    </li>
</ol>

​