:before 疑似要素を使ってテキストを画像に置換のサンプル

:before 疑似要素を使った方法

:before 疑似要素を使った、画像置換テクニック。

Lucky bag::blog

下記の CSS を適用することによって、テキストを画像に置換している。IE は :before 疑似要素をサポートしていないので、普通のテキストで表示される。

h4:before {
        content: url("banner.png");
        display: block;
}
h4 {
        height: 110px;
        overflow: hidden;
}