使用CSS選擇嵌套元素

Question

我正在嘗試選擇共享類的特定元素，而我似乎無法找到最適合此元素的特定條目的方法。 我需要能夠隱藏現有照片（pic2.jpg）並在后台插入另一張照片（pic3.jpg）作為同一空間的替代品。

我嘗試過使用n-child選擇器並修補它但無濟於事。 我也嘗試使用多個不同的類作為選擇器，但它似乎掛斷了我在選擇器中包含的類。 我的直覺告訴我：#make Honda＃make-image {display：none ...}

<h1>...</h1>
<ul class="makes">
    <li class="make Toyota">
        <a href="#">
        <img class="make-image" src="pic1.jpg">
        <div class="make-info">
          <img class="make-logo" src="pic1.png">
          <h3 class="make-name">Can-Am®</h3>
          <div class="clearall"></div>
        </div>
        </a>
    </li>
    <li class="make Honda">
        <a href="#">
        <img class="make-image" src="pic2.jpg">
        <div class="make-info">
          <img class="make-logo" src="pic2.png">
          <h3 class="make-name">Honda</h3>
          <div class="clearall"></div>
        </div>
        </a>
    </li>

它應該允許我將現有圖像移出屏幕以替換為另一個作為背景圖像，但是，選擇器問題是最重要的。

Answer 1

我想我經過一些研究后想出來了。 通過查找具有該特定值的確切圖像源，看起來特定屬性選擇器在這里工作得非常好。 謝謝您的幫助！