テーブルの行の高さを指定する時全てのtdタグに？

Question

スタイルシートでテーブルの行の高さを指定する時は、全てのtdタグにスタイルシートを指定するべきか、１つだけ（一番左だけ）指定すればいいのかわからないので押してください。全てのtdタグに指定しても、一つのtdタグに指定しても、結局はその行の高さは指定した高さになります。コードを書く上でどちらが適切か教えてください。 -------------------------------------------------- １の例
（2列ともclass="test"を入れた）

1	2
3	4

２の例
（一番左の列だけclass="test"をいれた）

1	2
3	4

３の例
（スタイルシートは何も指定していない）

1	2
3	4

Ogre7077 · Accepted Answer

テーブルの行の高さ、なのでタグに指定するのが素直でしょうか。

1	2
3	4
5	6

ORUKA1951 · Answer

No.1です。具体的に書いたほうが分かりやすいかと
カスケーディングは
ユーザーの最重要宣言＞著者の最重要宣言＞著者の指定＞ユーザーの指定＞ブラウザの指定
に従いましたよね。
そして、指定を読み込んでいきますが、該当する要素に対する指定をすべて拾い出して、詳細度で比較します。
優先度、詳細度が同じ場合は、後出のもので上書きされます。
詳細度は、全称セレクタ/HTMLの属性での指定は0、タイプセレクタは1、属性やクラスセレクタは10、一意セレクタは100、dtyle属性の指定は1000ですよね。

ですので、
table tbody tr th,table tbody tr td{}
は詳細度[0,0,0,4]です。

特定のtableに適用する場合はtableはsummary属性必須ですので、
table[summary="コーヒーの種類"] tbody tr td{}
とすると詳細度は[0,0,1,4]となりますから、順番に関わらず上記指定を上書きします。

また、3行目以降でしたら、
table tbody tr+tr td{}
で、詳細度は[0,0,0,5]になりますから、最初の指定は上書きされますが、二番目の属性セレクタでの指定では上書きできません。

table tr:nth-child(2n) td+td{}
とすれば、偶数行の二列目以降のtdの色を変えたりもできますね。詳細度は[0,0,,,4]

データをマークアップするという表の特性上、その描画は「視覚系ユーザエージェントによる表の整形( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/tables.html#h-11.3 )」に従いますから、外見上はどこに指定してもその業はその高さ、もしくは内容の量に合わせて一定になりますが、その整形と、スタイルシートは意味がまったく異なります。

先日の
特定のテーブルのみ枠線の色を消したい( http://oshiete.goo.ne.jp/qa/8665634.html )
も参考になるかと・・

ORUKA1951 · Answer

CSS --Cascading Style Sheetsですのでカスケーディングを活用しましょう。--結論は明白です。
　タイプセレクタで詳細度の低いレベルで指定して、必要な場合はより高い詳細度で上書きする。style属性は詳細度が1000なので、限定された場所以外は使わない。
　⇒6 プロパティ値とカスケーディング、継承の割り当て( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/cascade.html )

テーブルの行の高さを指定する時全てのtdタグに？

テーブルの行の高さ、なので <tr> タグに指定するのが素直でしょうか。

No.1です。

CSS --Cascading Style Sheetsですのでカスケーディングを活用しましょう。

このQ&Aを見た人はこんなQ&Aも見ています

関連するカテゴリからQ&Aを探す

このQ&Aを見た人がよく見るQ&A

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング