CSSの優先順位

質問

CSS初心者で質問です。
同一スタイルシート内で下記の記述がありまして、table.sample1 適用部分の文字12pxを変えたくないのですが、どうしても可変になってしまいます。なにかよい方法はないでしょうか？

tr,td {
font-size: x-small;
line-height: 1.4;
}

table.sample1 {
border: solid 1px #cccccc;
border-collapse: collapse;
text-align: center;
font-size: 12px;
}

回答No.1

hck · ベストアンサー

table.sample1だけfont-size: 12px;で、他のテーブルのtdとtrがfont-size: x-small;ということですか？

でしたらfont-size: x-small;を適用するテーブルのみ
table.sample2 {
font-size: x-small;
line-height: 1.4;
}
としてclass指定するのはどうでしょう。

お礼

お礼が遅くなりました。。
結果hckさんの方法で解決いたしました。
ご回答ありがとうございました！

回答No.3

grumpy_the_dwarf

12ptって指定したからといって、固定されちゃって変えられないの
は某ブラウザだけのバグですから注意。

クラスがsample1である要素の中にあるtd要素について書くなら、
.sample1 td {
というふうに、スペースで繋いで書きましょう。ちゃんと、classが
sample1でないtableのtd要素とは違う指定が出来ます。「子孫セレ
クタ」と呼ばれています。.sample tr tdでも動作しますが、trの子
孫でないtdが無視されると明示しているだけで、実質的には意味は
ありません。

お礼

お礼遅れました。。
バグだったんですか・・・、知らなかったです。
回答有難うございました！

回答No.2

noname#39970

table内は継承がされないものがかなりあるのでこうして個別にしたら良いかと

tr,td {
font-size: x-small;
line-height: 1.4;
}

table.sample1 {
border: solid 1px #cccccc;
border-collapse: collapse;
text-align: center;
}

.sample1,.sample td{
font-size: 12px;
}

あれ？ .sample tr td じゃないとだめ？　要検証

お礼

お礼が遅くなりました。。
無事解決いたしました。
ご回答ありがとうございました！