![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
教えてください。
ページ全体の背景色を変更するのは、
↓でできたのですが、
<form>
<input type="button" value="White" onClick="document.bgColor='white'">
<input type="button" value="Gray" onClick="document.main='gray'">
<input type="button" value="Blue" onClick="document.bgColor='blue'">
</form>
ページ内の一部のテーブルのみの背景色を
変更したい場合はどうように変更すればいいのでしょうか?
教えてください!
No.3ベストアンサー
- 回答日時:
特定の設定を使いまわすなら、cssでclassを
いじる方法もあります。
<style type="text/css">
.white{
background-Color:white;
color:black;
}
.gray{
background-Color:gray;
color:yellow;
}
.blue{
background-Color:blue;
color:red;
}
</style>
<body>
<form>
全体:
<input type="button" value="White" onClick="document.body.className='white'">
<input type="button" value="Gray" onClick="document.body.className='gray'">
<input type="button" value="Blue" onClick="document.body.className='blue'"><br>
テーブル1:
<input type="button" value="White" onClick="document.getElementById('t1').className='white'">
<input type="button" value="Gray" onClick="document.getElementById('t1').className='gray'">
<input type="button" value="Blue" onClick="document.getElementById('t1').className='blue'"><br>
テーブル2:
<input type="button" value="White" onClick="document.getElementById('t2').className='white'">
<input type="button" value="Gray" onClick="document.getElementById('t2').className='gray'">
<input type="button" value="Blue" onClick="document.getElementById('t2').className='blue'"><br>
</form>
<table width=100% id="t1">
<tr><td>test</td></tr>
</table>
<table width=100% id="t2">
<tr><td>test</td></tr>
</table>
</body>
No.2
- 回答日時:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang=ja><head>
<script type="text/javascript">
function chClr(id,clr){
clr=clr.toLowerCase();
if(document.getElementById) document.getElementById(id).style.backgroundColor=clr;
else if(document.all) document.all[id].style.backgroundColor=clr;
else if(document.layers) document.layers[id].style.backgroundColor=clr;
else return false;
}
</script>
</head>
<body>
<table border=1><td id="aTd">AAAAAAA</td></table>
<p>
<input type="button" value="Yellow" onclick="chClr('aTd',this.value)">
</p>
</body>
</html>
;-)
No.1
- 回答日時:
あたしなら・・・
<TABLE id=aTable>
・・・
</TABLE>
<INPUT type="button" onclick="document.getElementById('aTable').style.backgroundColor=this.value;" value="white">
位で済ませちゃうけど、コレじゃダメかな?
この回答への補足
ありがとうございます!!!
できました!!
そして、もうひとつ教えていただきたいのですが、
そのテーブル内にあるテキストの文字色も背景色と同タイミングで違う色に変えたい場合は、何を追加したらいいでしょうか?
何度もすみません!
宜しくお願いします!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・「I love you」 をかっこよく翻訳してみてください
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・昔のあなたへのアドバイス
- ・かっこよく答えてください!!
- ・あなたが好きな本屋さんを教えてください
- ・スタッフと宿泊客が全員斜め上を行くホテルのレビュー
- ・【大喜利】【投稿~8/27】 こんなガソリンスタンド二度と来るか!なぜそう思った?
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・【お題】動物のキャッチフレーズ
- ・【お題】甲子園での思い出の残し方
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・「それ、メッセージ花火でわざわざ伝えること?」
- ・自分用のお土産
- ・人生で一番お金がなかったとき
- ・一番好きなみそ汁の具材は?
- ・泣きながら食べたご飯の思い出
- ・ちょっと先の未来クイズ第1問
- ・ゴリラ向け動画サイト「ウホウホ動画」にありがちなこと
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
javaScriptの変数をJavaの変数...
-
親ウィンドウのフォームの値を変更
-
ボタンかリンクをクリックする...
-
formのfileの値をhiddenでも持...
-
JQueryでfunctionに引数としてI...
-
データバインド機能でand検索を...
-
onclickが動作しない
-
クリックでテーブル内の背景色...
-
javascriptからphpの呼び出し
-
return trueとreturn falseの用...
-
Selectボックスの幅を自動で広...
-
slickのレスポンシブ > center...
-
JavaScript ラジオボタン デ...
-
別ウィンドウへのsubmitの挙動...
-
クリアボタンの動作について
-
<input>の選択肢をプルダウンメ...
-
javascript作成してます。ラジ...
-
POST時に要素を削除してからPOST
-
プルダウンで選択すると、DBの...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
javaScriptの変数をJavaの変数...
-
クリックさせたいが、click()が...
-
追加ボタンを押した際に ok ボ...
-
onclickが動作しない
-
innerHTML内では改行は禁止?
-
formのfileの値をhiddenでも持...
-
JSのボタンを複数う使うには
-
onClickがinput type="image"だ...
-
VB.NETで<Input>タグ、<text...
-
ボタンかリンクをクリックする...
-
ボタンをクリックするとテキス...
-
開いた子ウィンドウにあるボタ...
-
オンクリックで現在時刻の取得→...
-
JavaScriptのfileオブジェクト...
-
URL 判定
-
if構文
-
BackSpaceしたい(QNo.2734284の...
-
複数のテキストボックスの値の...
-
jQueryでshow/hideが上手く行か...
おすすめ情報