CSS-Selektor für nicht bekannte Tags

Question

Ich würde gerne etwas CSS-Styling in allen , die in der intro-content-detalhes ist. Aber das Bild könnte innerhalb von N <p> oder <span> oder <div> sein. Und egal, was der Selektor dort hinbekommt und den Stil anwendet.

Bellow Ein Codebeispiel zeigt die Hierarchie:

https://jsfiddle.net/es21q6r2/

<div class="intro"> 
    <table class="intro-container-consulta" cellpadding="0" cellspacing="0"> 
     <tbody> 
      <tr> 
       <td> 
        <table class="intro-content-consulta" cellpadding="0" cellspacing="0"> 
         <tbody> 
          <tr> 
           <td class="intro-content-detalhes"> 
            <span readonly="true" textmode="MultiLine" style="display:inline-block;border-width:0px;width:100%;"><div class="ExternalClass24F5146CDC884387BF8C4A509ABE9CC2"><div></div> 
             <div> 
             </div> 
             <p>Item title</p> 
             <div> 
             </div> 
             <p style="text-align:center"><img src="https://yt3.ggpht.com/-v0soe-ievYE/AAAAAAAAAAI/AAAAAAAAAAA/OixOH_h84Po/s100-c-k-no-rj-c0xffffff/photo.jpg" alt="" class="ct-active">​</p> 
             <div> 
             </div> 
             <p style="text-align:center"></p> 
             <div> 
             </div> 
             <div style="text-align:left">Item details</div> 
             <div> 
             </div> 
             <p></p> 
             <div> 
             </div> 
             <p style="text-align:center"></p> 
             <div> 
             </div> 
             <ol> 
             <li><div style="text-align:left">Example #1: <span style="color:rgb(255, 0, 0)">A, B, C</span></div></li> 
             <li><div style="text-align:left">AA</div></li> 
             <li><div style="text-align:left">BB</div></li> 
             <li><div style="text-align:left">CC</div></li> 
             </ol> 
             <div> 
             </div> 
             <div><br></div> 
             <div style="text-align:center"> 
             <img src="https://s1.yimg.com/bt/api/res/1.2/mQAfNGBLFnjCvmN4ThWysQ--/YXBwaWQ9eW5ld3NfbGVnbztxPTc1O3c9NjAw/https://s.yimg.com/dh/ap/default/141103/logo2.png" alt=""></div> 
             <div> 
             </div> 
             <p></p></div> 
            </span> 
           </td> 
          </tr> 
         </tbody> 
        </table> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

Vielen Dank für jede Hilfe bei diesem

Answer 1

Sie verwenden die child selector, >, die nur ein Element auswählt, wenn es das ist Kind eines anderen. Sie wollen einfach alle Bilder so entfernen. Die Regel .intro .intro-content-consulta img sagt alle Bilder auszuwählen, die Nachkommen aller Elemente mit der Klasse sind intro-content-consulta, die Nachkommen der Klasse sind intro:

.intro .intro-content-consulta img { 
 
    padding: 5px; 
 
    border: 1px black solid 
 
}

<div class="intro"> 
 
    <table class="intro-container-consulta" cellpadding="0" cellspacing="0"> 
 
    <tbody> 
 
     <tr> 
 
     <td> 
 
      <table class="intro-content-consulta" cellpadding="0" cellspacing="0"> 
 
      <tbody> 
 
       <tr> 
 
       <td class="intro-content-detalhes"> 
 
        <span readonly="true" textmode="MultiLine" style="display:inline-block;border-width:0px;width:100%;"><div class="ExternalClass24F5146CDC884387BF8C4A509ABE9CC2"><div></div> 
 
             <div> 
 
             </div> 
 
             <p>Item title</p> 
 
             <div> 
 
             </div> 
 
             <p style="text-align:center"><img src="https://yt3.ggpht.com/-v0soe-ievYE/AAAAAAAAAAI/AAAAAAAAAAA/OixOH_h84Po/s100-c-k-no-rj-c0xffffff/photo.jpg" alt="" class="ct-active">​</p> 
 
             <div> 
 
             </div> 
 
             <p style="text-align:center"></p> 
 
             <div> 
 
             </div> 
 
             <div style="text-align:left">Item details</div> 
 
             <div> 
 
             </div> 
 
             <p></p> 
 
             <div> 
 
             </div> 
 
             <p style="text-align:center"></p> 
 
             <div> 
 
             </div> 
 
             <ol> 
 
             <li><div style="text-align:left">Example #1: <span style="color:rgb(255, 0, 0)">A, B, C</span> 
 
</div> 
 
</li> 
 
<li> 
 
    <div style="text-align:left">AA</div> 
 
</li> 
 
<li> 
 
    <div style="text-align:left">BB</div> 
 
</li> 
 
<li> 
 
    <div style="text-align:left">CC</div> 
 
</li> 
 
</ol> 
 
<div> 
 
</div> 
 
<div> 
 
    <br> 
 
</div> 
 
<div style="text-align:center"> 
 
    <img src="https://s1.yimg.com/bt/api/res/1.2/mQAfNGBLFnjCvmN4ThWysQ--/YXBwaWQ9eW5ld3NfbGVnbztxPTc1O3c9NjAw/https://s.yimg.com/dh/ap/default/141103/logo2.png" alt=""> 
 
</div> 
 
<div> 
 
</div> 
 
<p></p> 
 
</div> 
 
</span> 
 
</td> 
 
</tr> 
 
</tbody> 
 
</table> 
 
</td> 
 
</tr> 
 
</tbody> 
 
</table>