Was ist Tabellenzellpolster in CSS

Was ist Tabellenzellpolster in CSS

Standardmäßig hat eine Tabelle sehr enge Zellen, was zu Sichtbarkeitsproblemen führen kann. Um dies zu vermeiden, bevorzugen wir es, die CSS -Padding -Eigenschaft zu verwenden, um die Zellen einer Tabelle zu padeln. Polsterung macht Zellen breiter und größer als ihre Standardgröße. Infolgedessen sieht die Tabelle mit einer klaren Datenpräsentation gut aus.

In diesem Artikel werden wir beschreiben, wie man Zellpolster in einer Tabelle in CSS verwendet.

So verwenden Sie Tabellenzellpolster in CSS?

In CSS, die “PolsterungDie Eigenschaft fügt Hohlraum um den Elementinhalt hinzu. Es wird auch verwendet, um den Raum von jeder Seite zu steuern. Zum Beispiel kann die Polsterung von nur der linken Seite mit der Padding-Links-Immobilie hinzugefügt werden. In ähnlicher Weise können die Eigenschaften von Polsterrechten, Padding und Padding-Bottom verwendet werden.

Folgen Sie dem angegebenen Beispiel, um die Polsterung in die Tabellenzelle hinzuzufügen.

Beispiel 1: Fügen Sie die Polsterung in Tabellenzellen unter Verwendung von Polstereigenschaften hinzu

Auf unserer HTML -Seite haben wir eine Tabelle mit sehr schmalen Blöcken. Fügen wir in den Blöcken der Tabelle einen Platz hinzu:


Hier ist der aktuelle HTML -Code für unsere Webseite:










LinuxHinweis
GMBHUSA


Nehmen wir jetzt das "td"Oder Tabellendatenzelle zusammen mit der Tabelle und wenden Sie die“ anGrenzstilEigentum als "solide”. Auf diese Weise können Sie den Rand um den Tisch und seinen Inhalt bringen. Verwenden Sie im nächsten Schritt die “Polsterung”Eigenschaft mit dem Wert“1rem”. Infolgedessen wird die Tabellenzelle länger und breiter:


Speichern Sie Ihre HTML -Datei und starten Sie sie im Webbrowser, um das Ergebnis anzuzeigen:


Wie Sie sehen können, wurde die Polsterung erfolgreich in die Tabellenzelle hinzugefügt:

Beispiel 2: Passen Sie die Polsterung in Tabellenzellen von jeder Seite ein

In diesem Beispiel werden wir unseren Text in die obere linke Ecke der Zelle legen. Dafür werden wir die “zuweisen“Polsterung"Eigenschaftswert als"0px 35px 30px 0px”, Wobei der erste 0px für den oberen, zweiten 35px -Wert für die rechte, 30px für den unteren und vierten Wert 0px für die linke Seitenpolsterung ist:


Ausgang


Wir haben Ihnen erklärt, welche Tabellenzellpolsterung und wie man sie benutzt.

Abschluss

Tabellenzellen haben standardmäßig nur begrenzte Platz, was für den Betrachter Lesbarkeitsprobleme verursachen kann. Dafür die CSS “PolsterungDie Eigenschaft wird verwendet, um der Tabellenzelle etwas Platz zu verleihen. In diesem Leitfaden haben wir Ihnen geholfen zu verstehen, welche Tabellenzellpolsterung ist. Darüber hinaus haben wir auch verschiedene Beispiele gezeigt, die sich auf das Hinzufügen von Zellpolster unter Verwendung von CSS beziehen.