CSSセレクタをidとclass両方で指定
cssセレクタの説明だと
みたいに書いてるので idかclassのどっちかで選択するものなんだ って思ってました
# : id
. : class
div#main ←idがmainのdivタグ
span.blue ←classがblueのspanタグ
#content ←idがcontentの要素
. : class
div#main ←idがmainのdivタグ
span.blue ←classがblueのspanタグ
#content ←idがcontentの要素
みたいに書いてるので idかclassのどっちかで選択するものなんだ って思ってました
あるとき idで指定している要素にclass名をJavaScriptから付けたり外したりしてデザインを変えようとしました
にしたりclass外して
これだと class="red" をつけてもセレクタの強さがdiv#abcのほうが強いので 色が変わりません
div.redの方だけ html>body>…>div.red のようにしてセレクタが勝つようにしようかとも考えましたが見づらいしいい方法に思えません
#abcと.redの両方使えたらなー
無駄だろうと思いつつ
div#abc.red と書いてみると
動いたーーー!!!!
えーこんな書き方できたんだ
今まで無駄なことしてたなー
こんな簡単にできるなら もっと早く教えてよー
div#abc{
color: #333;
}
div.red{
color: red;
}
のようなスタイルを用意しておいてcolor: #333;
}
div.red{
color: red;
}
<div id="abc">てきとーな文字</div>
にclass追加して<div id="abc" class="red">てきとーな文字</div>
にしたりclass外して
<div id="abc">てきとーな文字</div>
にしたりでstyle属性を追加せずにデザインを変える方法ですこれだと class="red" をつけてもセレクタの強さがdiv#abcのほうが強いので 色が変わりません
div.redの方だけ html>body>…>div.red のようにしてセレクタが勝つようにしようかとも考えましたが見づらいしいい方法に思えません
#abcと.redの両方使えたらなー
無駄だろうと思いつつ
div#abc.red と書いてみると
動いたーーー!!!!
えーこんな書き方できたんだ
今まで無駄なことしてたなー
こんな簡単にできるなら もっと早く教えてよー