Ich möchte meine TR-Grenze mit Klasse

Question

umgehen

Hier ist mein Code, ich möchte die bestimmten CSS-Eigenschaften durch meine Klasse überschreiben, ich möchte border-bottom: 1px solid #e7b2b2; zu border:none; zu meinem spezifischen Klasse Bieter überschreiben, verbleibende Tabelle ich brauche diese Grenze-unten . Kann mir jemand helfen? Ich habe versucht, dies aber nicht funktioniert

.bidder tr { 
 
    border: none !important; 
 
} 
 

 
table tr, 
 
table th, 
 
table td { 
 
    border: none; 
 
    border-bottom: 1px solid #e7b2b2; 
 
    font-family: 'Lato', sans-serif; 
 
    font-size: .875rem; 
 
}

<table id="content" width="100%" bgcolor="ffffff" border="0" cellpadding="0" align="center" cellspacing="0" class="bidder"> 
 
    <tbody> 
 
    <tr> 
 
     <td width="50"> 
 
     <img src="http://icons.veryicon.com/png/System/Super%20Mono%203D/auction%20hammer.png" width="40"> 
 
     </td> 
 
     <td> 
 
     <span style="font-size:11px; color:#000000; font-weight:bold;"> Product Name </span> <br> 
 
     <span style="font-size:14px; color:#3573a4;"> Testing Scraps redodfi jdfsfjksfjk hkdfs </span> 
 
     </td> 
 
     <td width="100" align="right"> 
 
     <img src="https://www.allbids.com.au/img/logo_xs.png" width="40"> &nbsp; <img src="http://marketplace.trainzauctions.com/themes/default/img/autobid.png" width="40"> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 1

Sie müssen .bidder th, .bidder td in der Wahlliste hinzuzufügen.

.bidder tr, 
 
.bidder th, 
 
.bidder td{ 
 
    border: none !important; 
 
} 
 

 
table tr, 
 
table th, 
 
table td { 
 
    border: none; 
 
    border-bottom: 1px solid #e7b2b2; 
 
    font-family: 'Lato', sans-serif; 
 
    font-size: .875rem; 
 
}

<table id="content" width="100%" bgcolor="ffffff" border="0" cellpadding="0" align="center" cellspacing="0" class="bidder"> 
 
    <tbody> 
 
    <tr> 
 
     <td width="50"> 
 
     <img src="http://icons.veryicon.com/png/System/Super%20Mono%203D/auction%20hammer.png" width="40"> 
 
     </td> 
 
     <td> 
 
     <span style="font-size:11px; color:#000000; font-weight:bold;"> Product Name </span> <br> 
 
     <span style="font-size:14px; color:#3573a4;"> Testing Scraps redodfi jdfsfjksfjk hkdfs </span> 
 
     </td> 
 
     <td width="100" align="right"> 
 
     <img src="https://www.allbids.com.au/img/logo_xs.png" width="40"> &nbsp; <img src="http://marketplace.trainzauctions.com/themes/default/img/autobid.png" width="40"> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

Sie müssen die Stile für Tabellenüberschriften (<th>) und Tabellenzellen (<td>) als auch ...

.bidder tr, 
.bidder th, 
.bidder td { 
    border: none !important; 
} 

außer Kraft zu setzen. .. Ihr Selektor zielt nur auf die Tabellenzeile und nicht auf die Zellen oder Überschriften.

Answer 3

Das Problem ist, verstecken Sie nur tr unteren Rand. Aber Grenzen in anderen zwei (th, td) Elementen gibt es noch. Sie würden ihnen auch einen Selektor geben.

So. Dies sollte alle Grenzen in der Tabelle verbergen, die Bieterklasse hat.

.bidder tr, .bidder th, .bidder td { 
      border: none !important; 
     } 

Answer 4

Sie können versuchen, den folgenden Code zu verwenden, und es kann Ihnen helfen.

table th, table td { 
    border: none; 
    border-bottom: 1px solid #e7b2b2; 
    font-family: 'Lato', sans-serif; 
    font-size: .875rem; 
} 
.bidder th, 
.bidder td { 
    border: none; 
} 

In Ihrem Code Sie verwenden border: none für nur tr Element aber Sie hinzufügen Grenze für th und td sowie Elemente. Sie müssen also border: none auch für th- und td-Elemente verwenden.

Answer 5

Fügen Sie einfach td nach Ihrer .bidder tr wie unten, um das Element innerhalb tr Ziel.

.bidder tr td { 
 
    border: none !important; 
 
} 
 

 
table tr, 
 
table th, 
 
table td { 
 
    border: none; 
 
    border-bottom: 1px solid #e7b2b2; 
 
    font-family: 'Lato', sans-serif; 
 
    font-size: .875rem; 
 
}

<table id="content" width="100%" bgcolor="ffffff" border="0" cellpadding="0" align="center" cellspacing="0" class="bidder"> 
 
    <tbody> 
 
    <tr> 
 
     <td width="50"> 
 
     <img src="http://icons.veryicon.com/png/System/Super%20Mono%203D/auction%20hammer.png" width="40"> 
 
     </td> 
 
     <td> 
 
     <span style="font-size:11px; color:#000000; font-weight:bold;"> Product Name </span> <br> 
 
     <span style="font-size:14px; color:#3573a4;"> Testing Scraps redodfi jdfsfjksfjk hkdfs </span> 
 
     </td> 
 
     <td width="100" align="right"> 
 
     <img src="https://www.allbids.com.au/img/logo_xs.png" width="40"> &nbsp; <img src="http://marketplace.trainzauctions.com/themes/default/img/autobid.png" width="40"> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>