2009-08-19 23 views

答えて

4

セルにクラス名を与え、クラスのスタイルを設定します。

<td class="cellClass">test</td> 

.cellClass { color: #a9a9a9 } 
+0

CSS標準では、特にCSSカスタムクラスを使わずにthidを解決する** first-child **という擬似クラスを定義していますが、ブラウザはサポートしていません。 – awe

+1

CSS宣言は複数の要素に適用されます。 – random

+2

質問に「最初の細胞ではなく」「単なる細胞」と書かれていました。 – rahul

0

セル/列にクラスやIDを与えるとテーブルセルの場合はその

0

に書式を適用するためにCSSを使用し、あなたはそれをあなたが参照できるような識別子のいくつかの並べ替えを与える必要がありますそれ。あなたのニーズに応じて、これはクラスかIDのどちらかになります。

.specialCell { color: red; } 

あなたが列に異なるスタイルを適用したい場合は、<col>タグがありますが、ブラウザのサポートが限られている:あなたのCSSで

<td class="specialCell">...</td> 

あなたはその後、別の書式を適用することができます。手動ですべての要素に、そのクラスを適用するには、おそらく優れている(またはJavaScriptを使用して)

5

使用IDセレクタが、この場合は、テーブルセルページのちょうど1つの要素をターゲットにする:

<tr> 
    <td id="foo"></td> 
</tr> 

そしてCSSで:

#foo 
{ 
//-- CSS styling goes here just for this element only 
} 

ハッシュ記号(#)はidに属するものとしてその名前セレクタをマークこと。あなたはTDrowspan属性に追加する場合は、あなたにそれを回すことができるようになります

td#foo 
{ 
//-- CSS styling goes here just for this element only 
} 

:あなたは、さらにそのようにそのIDでのみTDセルに適用するスタイルシートでそれをロックダウンすることができますあなたが設定したかもしれないスタイリングを保持してください。

<td id="foo" rowspan="3"></td> 

あなたは前の周期でCSSセレクタ名をマークすると、このような(。):

HTMLで classセレクタをターゲットとし、あなたがあれば、複数の一致する要素のスタイルを設定することができます
.foo 
{ 
    //-- CSS styles 
} 

あなたはそうのように、タグにCSSのクラス属性を適用します。それは一度ページ上でより多く表示される場合を除き

<tr> 
    <td class="foo"></td> 
    <td class="foo"></td> 
    <td class="foo"></td> 
</tr> 

CLASSを使用しないでください。

+0

ASP.NETのようなフレームワークは、要素に適用されるIDを変更します。私は他の人たちも同じことをしているのです。 IDに対して推奨する場合は、これに注意することが最善です。 – krdluzni

+0

HTML/CSSに基づいて書かれた回答は、他のフレームワークの使用は言及されていません。 – random

+0

@krdluzni:この例では、divタグのidを指定します。これはhtmlタグです。 ASP.NETはHTMLタグのidを変更することはありませんが、.NETタグ(例:** asp:Button **)のIDは、生成されたHTMLタグに異なるIDを与える可能性があります。 – awe

1

HTML​​タグと<colgroup>タグを確認してください。これにより、列全体または隣接する列グループに一度に書式設定を適用できます。

1

あなたは適用されCOLGROUPのスタイルを設定することができます

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
    <head> 
     <style type="text/css"> 
      #special { background:yellow } 
     </style> 
    </head> 
    <body> 
     <table> 
      <colgroup></colgroup> 
      <colgroup id="special"></colgroup> 
      <tr> 
       <td>a</td> 
       <td>1</td> 
      </tr> 
      <tr> 
       <td>b</td> 
       <td>2</td> 
      </tr> 
     </table> 
    </body> 
</html> 
0

はあなたが列に二つの名前を割り当てることができます。 ex

<div class="foo"></div> 
<div class="foo bar"></div> 
<div class="foo"></div> 

div.foo { color: #fff; } 
div.bar { background-color: green; } 

おそらくそれがあなたの問題を解決する可能性がありますか?

関連する問題