Schöne, bunte Tabellenrahmen
Anzeige
Rahmen ist nicht gleich Rahmen. Will man Farbe ins Spiel bringen, stehen einem verschiedene Methode zur Verfügung. Am flexibelsten ist CSS und mit seinen unterschiedlichen Rahmenmodellen.
Mit border="" kann jede Tabelle mit einem Rahmen versehen werden, doch der ist grau, dreidimensional und lässt sich nicht einfärben, sieht man von einem proprietären Befehl für den Internet Explorer ab.
Internet Explorer mit bordercolor="#FF0000"
Stylesheets bringen uns schon weiter. Doch style="border : 1px solid color" mag sich nur um den äußeren Rahmen kümmern. Der Rest bleibt unberührt.
Es bedarf einen tieferen Griffs in die Trickkiste, um das zu ändern. Mit style="border-collapse:separate" sieht es schon anders aus. Der Rahmen kann nun für jede Zelle einzeln definiert werden, was unterschiedliche Farben und Dicken pro Zelle ermöglicht.
<table style="border-collapse:separate; border : 0px solid
red;" width="200" cellspacing="0" cellpadding="0"><tr><td
style="border : 4px solid blue; padding : 10px"> </td><td
style="border : 4px solid green; padding : 10px"> </td></tr><tr><td
style="border : 4px solid purple; padding : 10px"> </td><td
style="border : 4px solid red; padding : 10px;"> </td></tr></table>
Wird stattdessen das Rahmenmodell style="border-collapse:collapse" verwendet, schließen die Rahmen direkt aneinander an.
<table style="border-collapse:collapse; border : 0px solid
red;" width="200" cellspacing="0" cellpadding="0"><tr><td
style="border : 4px solid blue; padding : 10px"> </td><td
style="border : 4px solid green; padding : 10px"> </td></tr><tr><td
style="border : 4px solid purple; padding : 10px"> </td><td
style="border : 4px solid red; padding : 10px;"> </td></tr></table>
Alle neueren Browser kommen damit gut zurecht. Im Zweifelsfalle bleibt es bei der herkömmlichen grau gerahmten Tabelle.
Über Sven Lennartz
Verwandte Artikel
Meine Meinung
Bitte beachten Sie: Werbung und Spam sind unerwünscht und können eine Rechnung zur Folge haben. Woher kommen die Bilder neben den Kommentaren?
