CSS (Cascading Style Sheets) bietet eine Vielzahl von Möglichkeiten, um Tabellen auf Ihrer Webseite zu gestalten. Mit CSS können Sie das Aussehen von Tabellen anpassen, um sie ansprechender und benutzerfreundlicher zu machen.

Grundlegende Tabellen-Eigenschaften

Hier sind einige grundlegende CSS-Eigenschaften zur Gestaltung von Tabellen:

border: Legt die Rahmenlinie der Tabelle fest.
table {
border: 1px solid #ccc;
}

border-collapse: Bestimmt, ob die Rahmenlinien der Tabelle zusammengeführt werden.
table {
border-collapse: collapse;
}

padding: Legt den Innenabstand der Tabellenzellen fest.
th, td {
padding: 10px;
}

text-align: Bestimmt die Textausrichtung in den Tabellenzellen.
th, td {
text-align: left;
}

background-color: Legt die Hintergrundfarbe der Tabellenzellen fest.
th {
background-color: #f2f2f2;
}

Beispiel für eine vollständige CSS-Datei zur Tabellengestaltung

Hier ist ein Beispiel für eine vollständige CSS-Datei, die verschiedene Tabellen-Eigenschaften auf einer Webseite anwendet:

body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
}

table {
width: 100%;
border: 1px solid #ccc;
border-collapse: collapse;
}

th, td {
padding: 10px;
border: 1px solid #ccc;
text-align: left;
}

th {
background-color: #f2f2f2;
}
In diesem Beispiel werden die Tabellen auf der Webseite mit verschiedenen CSS-Eigenschaften gestaltet, um ein ansprechendes und übersichtliches Layout zu schaffen.