2009-07-21 10 views
0

私のすべてのテーブル要素(<table><tr>など)のCSSアイテムがありますが、CSSを適用したくないテーブルが1つあります。1つのhtmlテーブルでCSSフォーマットをスキップ

このテーブルを生のHTMLテーブルとして表示し、CSSの書式設定を適用しないのが最も簡単な方法は何ですか。

また、私のCSSファイルで、私はこれを持っている:

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

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

私は複数のテーブル形式を持つようにしたい場合は、私はこれをどのように何をすればいいですか?

答えて

3

あなたは、いくつかの異なるスタイルを定義するためのクラスを使用する必要があり、例えば:そして、あなたはそのスタイルを適用したいテーブル上のクラス属性を設定し

// 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; 
} 

<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> 

はここSTYLE1が適用されます第1のテーブルのTDに、style2を第2のテーブルのTDに割り当てる。

グローバルなスタイル(クラス名なし)はすべての一致する要素(TDなど)に適用されますが、これらのスタイルは特定のスタイルによってオーバーライドされることがあります(グローバルにグリーンに設定されたstyle2にオーバーライドされます)。

BTW:CSSについてのチュートリアルは、http://w3schools.com/css/をご覧ください。

+0

私にそれを打つ。 +1 –

+0

上記の例では、すべてのテーブルが緑色の背景を持っています – leora

+0

いいえ、2番目のテーブルは白い背景になります。これは、 "table.style2 td"がデフォルト(緑色)の背景を上書きするためです。 – M4N

0

フォーマットする表のクラスを使用します。例えば今

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

CSS側では、次のようにあなたが正しい書式を定義していることを確認します

table.myformat th { 
    color: red; 
} 

table.myformat td { 
    color: green; 
} 

class="myformat"性質を持っているテーブルは、フォーマットを持つことになります。そうでないものはありません。このアプローチでは、さまざまなテーブル形式を異なるクラスとしてさらに作成し、それらを異なるテーブルに適用することができます。

関連する問題