[ IE ] img タグの画像の周りに青い枠線が表示される

Tweet

Pocket

IE で、img タグで出力した画像の周りに青の枠線が表示されます。どうやらこの現象が発生するのは、a タグ内に img タグを記述している場合に発生するようです。

※2016-01-16
IE11 では、この問題は発生していないようです。

IEで青の枠線が表示される HTML 例

<a href="#"><img src="image.jpg" /></a>

「なぜにIEだけ？」と言っていても、枠線が表示されるのは嫌だとゴネているおっさんがいるので、解決策を考える必要があります。私は別に何とも思わないのですが・・・

border 属性を設定する

<a href="#"><img border="0" src="image.jpg" /></a>

なんとか、枠線が表示されなくなりました。

CSS で共通設定

毎回、a タグ内であるか否かを判断するのは手間であり忘れることもありますので、共通の css に設定しておくことは、良い対応だと思います。

img {
    border: 0px;
}

Tweet

Pocket