ＩＥでの”a img”の枠線について

質問

imgにアンカータグでリンクを貼りつけています。
border-style：none；にしているので、通常は枠線が表示されないのですが、
そのイメージをクリックした場合に、イメージの枠線が薄く表示されてしまいます。

もちろんクリックするとリンク先に飛ぶのですが、また元の画面に戻ってみると、
先ほどの薄い枠線がまだ表示された状態になっています。
これはＩＥでのみ起こる現象です。

これはどのように対策すれば解決できますでしょうか？
どうぞよろしくお願いいたします。

回答No.3

outbrave · ベストアンサー

ANo.1です。

javascript:void(0)は、今回直接関係ありません。

javascript:void(0)としておくと、何もアクションを起こさないので、テストすることができます。（つまり他のページへ移動することなく確認ができるということです）

回答No.4

ORUKA1951

>border-style：none；にしているので、通常は枠線が表示されないのですが、
何に対して設定しているのかによりますが・・・
a img{border:none;}/*リンクのある画像は枠線をつけるのがデフォルトなので */
a:link,a:visited{border:none;}/* 以下a要素に関する枠の指定 */
a:focus,a:hover{border:none;}
a:active{border:none;}
とでもしておけばよいでしょう。擬似クラスが設定してある部分は詳細度が同じなので順番が大事です。

回答No.2

ORUKA1951

a img{border:none;}/* 詳細度2 */
これだけでだめなら
/* 擬似クラスは下記順番で */
a:link img{border:none;}/* 詳細度12 */
a:visited img{border:none;}/* 詳細度12 */
a:focus img,a:hover img{border:none;}/* 詳細度12 */
a:active img{border:none;}/* 詳細度12 */
　要はデフォルトのスタイルシートより詳細度を上げておけばよいかと思います。

回答No.1

outbrave

フォーカスリングのことだと思います。

<a href="javascript:void(0);" onfocus="this.blur()">test</a>
アンカータグに、onfocus="this.blur()" を追加

または、
a:focus {outline: none;}
スタイルシートで上記を追加、こちらはIE8以降のみに適用されます。

お礼

ありがとうございます！
おかげさまでできました！

ちなみに"javascript:void(0);"はどのような意味でしょうか？
これがなくてもonfocusだけでもできました。