[CSS]マウスのフォーカスで、画像の上にアイコンを表示するスタイルシート

画像にマウスをフォーカスすると、画像の上にアイコンを表示するスタイルシートをJanko At Warp Speedから紹介します。

Add zoom icon to images using CSS (and jQuery, of course)
demo

アイコンを表示する仕組みは、画像の上に空spanを配置し、hover時に「display:block;」を適用するものです。

また、空spanを最初から配置しない代わりに、スクリプト（jQuery）を使用し、フェードのアニメーションを伴ってアイコンを表示するサンプルも紹介されています。
demo（下段）