Wie füge ich mithilfe von CSS Abstand zwischen Zeilen in einer Tabelle hinzu?

So erstellen Sie Abstand zwischen Zeilen in einer Tabelle

Frage:

Ist es möglich, Abstand zwischen Zeilen hinzuzufügen? eine Tabelle mit CSS? Der folgende Code führt nicht zum gewünschten Ergebnis:

tr.classname {
  border-spacing: 5em;
}

Antwort:

Um Platz zwischen Zeilen in einer Tabelle zu schaffen, müssen Sie auf dem td Abstand verwenden Elemente. Sie können den folgenden CSS-Code verwenden:

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

In diesem Code ist der tr.spaceUnder > Der td-Selektor wendet die Auffüllung nur auf td-Elemente an, die direkte untergeordnete Elemente von tr-Elementen mit der Klasse spaceUnder sind. Dadurch können Sie verschachtelte Tabellen verwenden, ohne den Abstand zwischen Zeilen zu beeinflussen.

Beispiel:

<table>
  <tbody>
    <tr>
      <td>A</td>
      <td>B</td>
    </tr>
    <tr class="spaceUnder">
      <td>C</td>
      <td>D</td>
    </tr>
    <tr>
      <td>E</td>
      <td>F</td>
    </tr>
  </tbody>
</table>

Ausgabe:

A	B
C	D
E	F

Das obige ist der detaillierte Inhalt vonWie füge ich mithilfe von CSS Abstand zwischen Zeilen in einer Tabelle hinzu?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!