テーブルに触れたら色が変わるようにする

質問

カーソル（矢印）がテーブルに触れたら色が変わるようにすることは可能ですか？

テーブルからカーソルが離れたら、元のテーブルの色に戻したいです。

回答No.3

noname#206842 · ベストアンサー

tableに触れたら色が変わる⇒というのは、各<tr>に触れたらという、ことでしょうか？・・・
CSSでの指定でしょうか？・・・それとも、scriptということでしょうか？・・・
CSSの質問欄なので、CSSとしてお答えすると、各<tr>項目に、classを設け、：hoverを指定すれば、できると思います。指定順位は、回答者No.2のとおりです。

tableに、CSSを指定すると、table全体に、対応してしまいますので、必ず、<tr>に指定してください！
tr .bg1{color:#000000;}
tr .bg1:hover{color:#336699;background-color:#336699;}

回答No.2

DrFell

部分的可能、部分的不可能、です。

pcサイトの場合は、hoverでできます。但し、順番があります。
【例】
table { background: red; } /*初期値*/
table:hover{ background: green; } /*ご要望*/
table:active { background: yellow; } /*押している最中*/

ｃｓｓには優先順位があり、下の方ほど優先されます。なので、普通のリンクlinkが下にあると、hoverしても下が優先されて反応しません。上記の順番を変えないで下さい。

スマホ・タブレット等の場合には、不可能です。

今、スマホ等の閲覧のほうがｐｃでの閲覧より多くなってきています。グーグルも、「来月20日からはどんな端末でアクセスしてもそこそこ表示されないサイトは、あまり評価しません」と公表しています。

lonwklyonsn さんの要望はｐｃでのアクセスでのみ可能で、全体の半数以下であることを承知の上で、使用されることをお勧めします。

回答No.1

sanzero

:hover
をつけるとマウスが乗った時のスタイルを指定できます。

table:hover{
background-color:red;
}

お礼

回答ありがとうございました。