Wie man eine HTML-Tabelle mit einem Rahmen um ihn herum, aber nicht um die Zeilen zu haben

Obwohl HTML-Table-Tags ein Attribut von "Grenze" nehmen können, wird dieses Attribut gilt nur für die gesamte Tabelle und werden Rahmen um alle Zellen der Tabelle auch hinzufügen. Da das Border-Attribut sowieso obsolet angesehen wird, verwenden Sie Cascading Style Sheets (CSS) Code Rahmenarten für jeden Teil Ihres HTML-basierten Tabelle definieren.

Anweisungen

1 Öffnen Sie Ihre HTML-Datei, enthält die Tabelle im nur-Text oder Code-Editor Ihrer Wahl. Gute Programme umfassen Notepad++, BBedit und jEdit, aber die alte Standby von Editor in Windows funktioniert gut.

2 Suchen Sie die Tabellen-Tags in die HTML-Datei. Alle Tabellen mit < Table >-Tag beginnt und endet mit dem < / table > Tag. Zwischen diesen Tags < Thead > definiert den Kopfbereich, < Tbody > definiert den Tabellenkörper und < tr > Tags definieren Zeilen. Einzelner Zellen, die Daten in < td > umschlossen werden und </td > Tags. Diese Tags sind nicht zu wichtig hier, aber da musst du nur einen Stil für das < Table >-Tag festlegen.

3 Fügen Sie < Stil > und < / style >-Tags innerhalb der HTML Datei < Head > tags. Innerhalb dieser Tags geben Sie die folgenden CSS-Formatierungsregel: Tabelle {Border: 1px solid Black;}. Diese Regel besagt, dass alle Tabellen auf der Webseite einen 1 Pixel breiten, Solid-Black Rahmen erhalten. "Schwarz" im Beispiel gegeben für jede benannte Farbe (der 256 "Websichere" Farben) zu wechseln oder die Farbe Hexadezimal-Code, die Sie bekommen können mit einem Farbwähler. Verfügbaren Rahmenarten sind solide, punktiert, gestrichelt, Doppelbettzimmer, Groove, Ridge, Einpresstiefe und Anfang an.

4 Fügen Sie eine neue Formatierungsregel mit demselben Code, jedoch wechseln Sie das Wort "Tabelle" zu welcher anderen Table-Tag Sie als Ziel möchten. Fügen Sie, dass die Grenzen für Zeilen nur, z. B. "Tabelle", "tr" im Beispiel ändern.

5 Bearbeiten Ihrer HTML-Datei-Table-Tag lesen "< Tabellen-Id 'ur-Id-Name' = >" um Ihre Tabelle eine ID geben Nur, dass bestimmte Tabelle in CSS-Code deiner Wahl, das Wort "Tabelle" in CSS-Code-Beispiel zu "#your Id-Namen" gewechselt. Fügen Sie eine Klasse anstelle einer ID an den Tisch, wenn Sie stattdessen eine Gruppe von Tabellen ansprechen möchten. Stehen Sie in CSS den Namen der Klasse mit einem Punkt anstelle der Hash-Symbol.

Tipps & Warnungen

• Mit zunehmender Browser-Unterstützung für CSS3-Style-Regeln können Sie versuchen, mithilfe der neuen Grenze-Eigenschaften wie Border-Radius und Grenze-Bild. Im Moment aber nicht alle Browser unterstützen diese.
• Entfernen Sie veraltete Attribute "Grenze" oder "Cellpadding" von HTML-Tabellen-Tags. Diese CSS-Stile stören und nicht in allen Browsern in vorhersehbarer Weise rendern.