如何編寫基於子類的父類的css？

我想添加CSS只爲listing-system類，但子類「expired」。我如何努力爲它寫CSS，任何人都可以幫助我。由於如何編寫基於子類的父類的css？

<div class="listing-system"> 
    <div class="listing-system-row"> 
     <div class="listing-system-row-image"> 
      <a href="#" style="background-image: url('#')"> 
       <div class="ribbon expired"> 
        Expired         
       </div><!-- /.ribbon --> 
      </a> 
     </div><!-- /.listing-system-row-image --> 
    </div><!-- /.listing-system-row-actions --> 
</div><!-- /.listing-system-row --> 

<div class="listing-system"> 
    <div class="listing-system-row"> 
     <div class="listing-system-row-image"> 
      <a href="#" style="background-image: url('#')"> 
       <div class="ribbon"> 
        Pending         
       </div><!-- /.ribbon --> 
      </a> 
     </div><!-- /.listing-system-row-image --> 
    </div><!-- /.listing-system-row-actions --> 
</div><!-- /.listing-system-row --

來源

2017-08-04 P.S.F.Romesh

可能重複https://stackoverflow.com/questions/1014861/is-there-a-css-parent-selector –

可能的複製[是否有一個CSS選擇器父？]（HTTPS：/ /stackoverflow.com/questions/1014861/is-there-a-css-parent-sele ctor） –

'：has'選擇器在css3中被刪除，所以你可以選擇基於子類的父類 –

你好，這是工作太

$(".ribbon.expired") .parentsUntil(".listing-system") .css("display", "none");

來源

2017-08-04 09:30:59

您可以通過jQuery做到這一點，如果你想選擇一個類「.listing系統」其中有一個子類「.ribbon.expired」，

$('.ribbon.expired').closest('.listing-system').css('your css style goes here');

來源

2017-08-04 05:17:36 Manju

或者更好：'$（'。ribbon.expired'）。closest（'。listing-system'）。addClass（ 'has-ribbon'）;'然後將你的樣式添加到CSS中的'has-ribbon'類。 –

如何編寫基於子類的父類的css？

回答

相關問題