中のテーブルにまで及ばせないようにする

質問

テーブルの中にテーブルがあり、
外のテーブルには

.table tr
.table td
でclassを設定しており、

その影響を中のテーブルにまで及ばせないようにすることは可能でしょうか？

<table class=css>
<tr>
<td>

<table>
<tr>
<td>
ここに外側のcssの影響を及ばせたくない
</td>
</tr>
</table>

</td>
</tr>
</table>

回答No.3

ORUKA1951 · ベストアンサー

まず、
1) プロパティには継承されるものと継承されないものがあります。
2) 出所によるソートが行われます。
　ユーザーの最重要宣言＞著者の最重要宣言＞著者の指定。ユーザーの指定＞ブラウザ
3) 詳細度によるソート
4) 出現順によるソート

＞.table tr
＞.table td
＞でclassを設定しており、
　classの指定はHTML側の話です。!!!
<table class="abc">とclass指定しています---になるはずです。
.table trは、スタイルシートでセレクタを.table trと指定していますといわなきゃ
　意味分かってますよね。.tableは、CSS1の古い書き方で、CSS2以降は基点セレクタを書くべきですので、意味的には*.tableであること。
よって
*.table tr {}であり、詳細度は 0011 であること

＞その影響を中のテーブルにまで及ばせないようにすることは可能でしょうか？
　子孫セレクタを使いより詳細度を高くする。後方互換を考えないなら子供セレクタを使う。

table{color:red;} /* colorプロパティは継承される */
table table{color:blue;}

スタイルシートを学ぶときは、プロパティより先に!!カスケーディングなどを身につけないとダメです。だってカスケーディングスタイルシート(CSS)なのですから・・
　⇒セレクタ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/selector.html )
　⇒値の割り当て、カスケード処理、継承( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cascade.html )

回答No.4

tkmojo

まず、cssの指定の仕方自体よくかわっていないようですね。

> .table tr
> .table td

こういう指定なら、htmlにはこのように書かなくてはなりません。
<table class="table">

<table class="css">とhtmlに記述した場合は、
cssの書き方はこんな感じです。

> .css tr
> .css td

クラス名と、それに対する指定の仕方をもう一度おさらいしましょう。

質問の件に関しては、基本的にはNo.2の方が言うように「>」を使えば楽ですが、
古いブラウザ（IE6等）では正しく表示されません。

古いブラウザにも対応した形で作るなら、
一度指定したものを、下層で打ち消す（または別の指定をする）必要があります。

.css td{
　　　width:100px;
}

.css table td{
　　　width:auto;
}

というような感じですね。

回答No.2

noname#217950

.css>tr
という書き方があります。
これで『.css』の『直下のｔｒ』という意味になります。

.css tr
ですと、.cssの中の『tr（全て）』となります。

回答No.1

noname#184541

idを使えばいいですよ！