Wie füge ich einen Abstand zwischen Zeilen in einer Tabelle hinzu, ohne den Randabstand zu verwenden?

Zeilenabstand in einer Tabelle

Das Hinzufügen vertikaler Abstände zwischen Tabellenzeilen verbessert die Lesbarkeit und die visuelle Attraktivität. Obwohl border-spacing wie die ideale Eigenschaft für diesen Zweck erscheint, beeinflusst sie nur den Abstand zwischen Tabellenzellen. Um den Zeilenabstand zu erreichen, müssen wir nach alternativen Lösungen suchen.

Der Schlüssel liegt in der Anpassung der Auffüllung einzelner Tabellendatenzellen (-Elemente). Hier ist eine CSS-Lösung:

tr.spaceUnder > td {
  padding-bottom: 1em;
}

In diesem Code zielen wir auf direkte untergeordnete Elemente (>) von Tabellenzeilen mit der Klasse „spaceUnder“. Dies ermöglicht selektive Abstände, was in Szenarios mit verschachtelten Tabellen nützlich sein kann.

Die Eigenschaft „padding-bottom“ definiert den vertikalen Abstand unterhalb des Zellinhalts. Passen Sie diesen Wert nach Bedarf an, um den bevorzugten Reihenabstand zu erreichen. Indem wir den unteren Rand der Zelle auffüllen, schaffen wir effektiv eine Lücke zwischen der Zelle und der Zeile darunter.

Obwohl der Randabstand in diesem Fall nicht anwendbar ist, stellt die Auffüllung ein wirksames Mittel zur Steuerung des Zeilenabstands dar in Tabellen.

Das obige ist der detaillierte Inhalt vonWie füge ich einen Abstand zwischen Zeilen in einer Tabelle hinzu, ohne den Randabstand zu verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!