Wie kann ich jeder Zeile in einer HTML-Tabelle einen unteren Rand hinzufügen?

Rand am Ende der Tabellenzeile hinzufügen

Beim Versuch, am Ende jeder Tabellenzeile einen durchgehenden schwarzen Rand hinzuzufügen, tritt ein Problem auf (). Die Verwendung von Inline-Stilen oder CSS erwies sich zunächst als wirkungslos.

Um dies zu beheben, integrieren Sie border-collapse:collapse; innerhalb der Tabellenregel in Ihrem CSS:

table {
    border-collapse: collapse;
}

Diese Änderung führt im Wesentlichen benachbarte Ränder zusammen und stellt sicher, dass die auf einzelne Zeilen angewendeten Ränder sichtbar sind.

Codebeispiel:

<table>
  <tr><td>A1</td><td>B1</td><td>C1</td></tr>
  <tr><td>A2</td><td>B2</td><td>C2</td></tr>
  <tr><td>A2</td><td>B2</td><td>C2</td></tr>
</table>

table {
  border-collapse: collapse;
}

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

Bei der Anwendung dieses CSS werden die Ränder zwischen den Zeilen in der Tabelle als sichtbar erwartet.

Das obige ist der detaillierte Inhalt vonWie kann ich jeder Zeile in einer HTML-Tabelle einen unteren Rand hinzufügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!