h1 {
position: relative;
margin: 40px auto 20px auto;
background: #d0eee8;
}
h1 span {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
h1 span.label {
z-index: -1;
}
#loremipsum {
width: 222px;
height: 59px;
}
#loremipsum span.img {
background: url('lorem-ipsum.png') no-repeat;
}
...
<h1 id="loremipsum">
<span class="label">Lorem ipsum</span>
<span class="img"></span>
</h1>
<h1 id="dolorsitamet">
<span class="label">Dolor sit amet</span>
<span class="img"></span>
</h1>
<h1 id="quamurna">
<span class="label">Quam urna</span>
<span class="img"></span>
</h1>
Listing 37.7. Technika FIR i przezroczyste obrazy
Rozdział 37. FIR — wymiana obrazów na teksty