Hey Leute,
ich saß vorhin vor dem Problem, dass ich folgendes brauchte:
- eine Überschrift (h1)
- ein Bild als Überschrift, d.h. Schrift nicht zu sehen
- das ganze vollflächig als Link anklickbar
- Barrierefreiheit, d.h. Schrift und kein Bild zwischen <h1></h1> und kein display: none; für h1 und hereinschieben eines Bildes.
Tja, was tun?
Drei Dinge gingen wunderbar zusammen, nur vier bekam ich nicht hin
Dann kam mir die Erleuchtung: Zuvor mit XHTML Doctype gearbeitet, stellte ich auf den HTML 5 Doctype um (der ist eh besser zu merken^^).
HTML 5 erlaubt eine Umschachtelung von block-Elementen mit einem Link - Problem gelöst!
Und hier kommt ihr ins Spiel - denn irgendwie habe ich das Gefühl, ich hätte bei meiner Lösung irgendeinen Nachteil vergessen
Hier der (relevante) Code:
HTML
<!DOCTYPE html>
<html>
<head>
<title>Titel</title>
<style><!--
h1 {
background-image: url("bild.png");
height: AAApx;
width: BBBpx;
font-size: 0.1px;
}
--></style>
</head>
<body>
<a href="index.html"><h1>Überschrift</h1></a>
</body>
</html>
Alles anzeigen
Was meint ihr?
LG
Laura