Javascriptを使用せずに画像の説明をマウスオーバーで出す方法

マウスオーバーで画像の説明を出したい。
だけど、Javascriptは使いたくない。

HTML的に使い方は間違っているけど、以下の記述をすればマウスオーバーでツールチップを出すことが出来る。

<img src="./hogehoge.png" title="ここに説明入れたらツールチップで表示される">

出来上がり図

最初はalt属性に説明を入れれば表示できるかと思ったんだけど、Firefoxだと本来のalt属性と違う使い方*1をされるので禁止しているらしい。詳しいことは以下のリンクに乗っている。

Mozilla Firefox と \"img\" タグの alt 属性 - しじまのとばり

なので、苦肉の策でtitle属性に説明を入れることで表示してみた。だけど、これもFirefosがalt属性でツールチップを表示しない理由と同じで本来の遣い方と違うと思うんだよね。

非推奨なやり方なんで、ご利用はご自分の判断で・・・。

*1:今やっているようなことね