3.10 HTML-Text durch ein Bild ersetzen
Problem
3.9 HTML-Text wie z.B. die Überschrift in Abbildung 3-16 soll mit einem Bild überlagert werden, um größere grafische oder typografische Freiheit bei der Gestaltung zu haben.
Lösung
Verwenden Sie die Gilder/Levin-Bildersetzungstechnik.
Zu Beginn fügen Sie vor dem HTML-Text ein span-Element ein:
<h1>
<span></span>
Dies ist der Platzhalter-Text
</h1>
Abbildung 3-16. Die Standarddarstellung der textbasierten Überschrift
Im nächsten Schritt definieren Sie die Breite und Höhe des h1-Elements, um die Dimensionen des Ersetzungsbildes festzulegen. Gleichzeitig erhält die Eigenschaft position den Wert relative:
h1 { ...Get CSS Kochbuch now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
