画像リンクの背景色を１つ１つ指定する。

質問

画像にリンクを張り、その画像に触れたときに、画像の透過されている部分の背景色が変わるようにしたいのですがタグがわかりません。
前に一度やったことがあるのですが、そのときのソースを消してしまってわからなくなっているので困ってます。

<a href="xxx.html" style="a:hover background:#ff0000"><img src="xxx.gif" border="0"></a>

↑こんな感じだったようなきがします。（あまり記憶にさだかではないのですが。）

全体的にリンクの背景色をしていするスタイルシートはわかるので、そうではなくページ内にあるリンク一つ一つの背景色を指定する方法が知りたいです。よろしくおねがいします。

回答No.3

godakaz · ベストアンサー

#2さんの回答で良いのでは？

ちょっとした誤記（「backgound」）があったので、それを修正して、こんな感じで良いかと。

<a href="xxx.html" id="a0" name="a0" onMouseOver="this.style.backgroundColor='#ff0000';" onMouseOut="this.style.backgroundColor='#ffffff';"><img id="hoge0" name="hoge0" src="hogehoge.gif" width="80" height="25" alt="hoge" border="0">
</a>

お礼

ありがとうございました！少しＩＤ、ＮＡＭＥ指定をはずしたりして簡単にしちゃいましたが、無事配布できそうです。はじめ＃２の方のやり方でやってみたんですが触れてないときの背景色の指定がうまくいかずこまってました。
引越し中でネット接続が出来なくお礼が遅くなりましたがほんとうにありがとうございますね！

回答No.2

pentaro_2000

<a href="xxx.html" onmouseover="this.style.background='red'" onmouseout="this.style.backgound='white'">
　<img src="xxx.gif" border="0">
</a>

外してるような気もしますが念のため。

お礼

回答ありがとうございます。pentaro_2000さんの回答を元に＃３さんの方で無事解決いたしました。御礼が遅くなってしまってほんとすみません；

回答No.1

godakaz

お問合せの件は、こういう感じのクラス指定によるやつでしょうか？

<style>
<!--
a.1:hover{ background:#ff0000; }
a.2:hover{ background:#00ff00; }
a.3:hover{ background:#0000ff; }
//-->
</style>

<a href="xxx.html" class="1">123456</a><br>
<a href="xxx.html" class="2">234567</a><br>
<a href="xxx.html" class="3">345678</a><br>

お礼

いえ、あたしが以前にやってたのはＡタグやＩＭＧタグの中にそのままSTYLE指定してたものだったんですが、こういうやり方もあるんですね！知りませんでした。でも素材配布用とセットで配信するタグなので中にＳＴＹＬＥをくみこむ方法があるなら教えて欲しいです・・・。