скрытие изображения и его наложения

Question

У меня есть изображение, которое появляется только в том случае, если у него есть некоторый контент в его атрибуте ALT. Это хорошо работает с помощью:

img.video[alt=""] { 
    display:none; 
    height:0px; 
} 

Однако я хочу, чтобы изображение также накладку, что также исчезнут ... оверлей кнопка воспроизведения, но она остается.

  <li> 
      <img class="video" src="<?php echo $row_rs_dealItem['imagemain']; ?>" alt="<?php echo $row_rs_dealItem['video']; ?>"> 
       <img id="videoLogo" src="images/video.png"/> 
      </img> 
      </li> 

Есть ли лучший способ решить эту проблему?

спасибо, ребята

Answer 1

Да, есть, вы должны использовать селектор adjacent sibling, потому что элементы img не могут иметь дочерние элементы.

HTML-:

<li> 
    <img class="video" src="..." alt="..."> 
    <img class=v src="images/video.png"> 
</li> 

И CSS:

img.video[alt=""], img.video[alt=""] + img.v { 
    display:none; 
    height:0px; 
} 

Answer 2

Попробуйте добавить класс к родительскому литию, когда содержание должно быть спрятано (если нет альтернативного текста в вашем случае). Затем используйте CSS, чтобы показать/скрыть нужные вам элементы.