Ajouter border-bottom à la ligne du tableau <tr>

Question

J'ai une table de 3 par 3. J'ai besoin d'un moyen pour ajouter une bordure au bas de chaque ligne tr et lui donner une couleur spécifique.

J'ai d'abord essayé la voie directe, c'est à dire:

<tr style="border-bottom:1pt solid black;">

Mais cela ne fonctionne pas. J'ai donc ajouté CSS comme ceci:

tr {
border-bottom: 1pt solid black;
}

Cela n'a toujours pas de travail.

Je préfère utiliser les CSS, car alors je n'ai pas besoin d'ajouter un style d'attribut à chaque ligne. Je n'ai pas ajouté d' border d'attribut à l' <table>. J'espère que cela n'affecte pas mon CSS.

Answer 1

Ajoutez border-collapse:collapse à votre règle de table:

 table { 
    border-collapse: collapse; 
}
 

Lien

Answer 2

J'ai eu un problème comme celui-ci avant. Je ne pense pas que tr peut prendre un style de bordure directement. Ma solution de contournement consistait à styliser les td s dans la ligne:

 <tr class="border_bottom">
 

CSS:

 tr.border_bottom td {
  border-bottom:1pt solid black;
}
 

Answer 3

Utilisez border-collapse:collapse sur la table et border-bottom: 1pt solid black; sur la table

Answer 4

Utilisation

border-collapse:collapse que Nathan a écrit et vous devez définir

td { border-bottom: 1px solid #000; }

Answer 5

Affichage de la ligne comme un bloc.

tr {
    display: block;
    border-bottom: 1px solid #000;
}

et pour afficher des couleurs alternées simplement:

tr.oddrow {
    display: block;
    border-bottom: 1px solid #F00;
}