そこそこ普通に使っているCSSですが、ブラウザの違いでうまく動作しない場合はもちろん、単純な指定ミスなどで時間をとられることが未だ多い僕です。その都度調べながら、ハック的な情報を吸収するのですが忘れてしまう…てことで、CSSのメモを兼ねて勉強することにしました。 第1回目は「半透明の背景を画像に重ね、キャプションを表示する」です。"5 Ways to Spice up Your Images with CSS"の"Image with Caption"を参考にしております。 demoを見る HTML <div id="desc"> <img id="image" src="sample.jpg" alt="test" /> <cite>2008年11月11日 福岡市動物園にて</cite> </div> CSS #desc{ position:relative; display:block
![CSSメモ_1:半透明の背景を画像に重ね、キャプションを表示する](https://cdn-ak-scissors.b.st-hatena.com/image/square/683132522b6a018ba7089edbeb50100e4eb77368/height=288;version=1;width=512/http%3A%2F%2F3.bp.blogspot.com%2F_GPMPPVkyJe8%2FSW3XqUNifwI%2FAAAAAAAAB0A%2F8E6pPSVq5rw%2Fw1200-h630-p-k-no-nu%2F20090114211444.jpeg)