2009-07-21 15 views
0

Ich habe CSS-Elemente für alle meine Tabellenelemente (<table>, <tr>, etc ...) aber ich habe eine Tabelle, für die ich nicht möchte, dass das CSS zutrifft.CSS-Formatierung in einer HTML-Tabelle überspringen

Was ist der schnellste Weg, um diese Tabelle nur als eine Raw-HTML-Tabelle anzuzeigen und nicht meine CSS-Formatierung anwenden.

Auch in meiner CSS-Datei, ich habe dies:

table td 
{ 
    padding: 5px; 
    border: solid 1px #e8eef4; 
} 

table th 
{ 
    padding: 6px 5px; 
    text-align: left; 
    background-color: #FFFFFF; 
    border: solid 1px #e8eef4; 
} 

was ist, wenn ich mehrere Tabellenformate haben will, wie kann ich das tun?

Antwort

3

Sie sollten Klassen verwenden, verschiedene Stile zu definieren, zB:

// global table styles - will be applied to all tables 
table td 
{ 
    background-color: green; 
} 

// styles for tables with class "style1" 
table.style1 td 
{ 
    border: solid 1px red; 
} 
table.style1 th 
{ 
    ... 
} 

// styles for tables with class "style2" 
table.style2 td 
{ 
    border: solid 1px blue; 
    background-color: white; 
} 

dann das Klassenattribut auf den Tischen, wo man diesen Stil anwenden möchten:

<table class="style1"><tr><td> red border, green background </td></tr></table> 

<table class="style2"><tr><td> blue border, white background </td></tr></table> 

<table><tr><td> default border, green background </table> 

Hier style1 angewendet zu TDs der ersten Tabelle, style2 zu TDs der zweiten Tabelle. Beachten Sie, dass globale Stile (ohne Klassennamen) für alle übereinstimmenden Elemente (z. B. TDs) gelten. Diese Stile können jedoch durch bestimmte Stile überschrieben werden (wie in der Hintergrundfarbe gezeigt, die global auf grün gesetzt ist, aber für style2 überschrieben).

BTW: für ein Tutorial über CSS, werfen Sie einen Blick auf http://w3schools.com/css/.

+0

schlagen Sie mich dazu. +1 –

+0

In Ihrem obigen Beispiel hätten alle Tabellen den grünen Hintergrund – leora

+0

Nein, die zweite Tabelle hätte einen weißen Hintergrund. Dies liegt daran, dass "table.style2 td" den Standardhintergrund (grün) überschreibt. – M4N

0

Verwenden Sie eine Klasse für die Tabelle, die formatiert werden soll. Zum Beispiel

<table class="myformat"> 
    .... 
</table> 

nun auf der CSS-Seite stellen Sie sicher, die richtige Formatierung wie folgt definieren:

table.myformat th { 
    color: red; 
} 

table.myformat td { 
    color: green; 
} 

Die Tabellen, die die class="myformat" Eigenschaft haben, wird die Formatierung haben. Diejenigen, die nicht werden. Mit diesem Ansatz können Sie verschiedene Tabellenformate als verschiedene Klassen erstellen und auf Ihre verschiedenen Tabellen anwenden.

Verwandte Themen