Es gibt einen Unterschied zwischen dem Einfügen eines Bildes auf a Website und das Bild zu einem anklickbaren Link zu machen. Obwohl die HTML ist ähnlich, ein Link beruht auf einem Anker -Element, während ein Bild die. verwendet img Element. Ein Bild kann jedoch in einem Anker verschachtelt sein, sodass dieses Bild als Link anklickbar ist.
Einfügen von Bildern in Ankerelemente
Eine gängige Verwendung eines bildbasierten Links ist die Logografik der Site, die dann mit der Homepage der Site verknüpft wird.
So platzieren Sie ein nicht anklickbares Bild im HTML-Dokument:
Um das Bild in einen Link umzuwandeln, fügen Sie den Ankerlink hinzu, öffnen das Ankerelement vor dem Bild und schließen den Anker nach dem Bild. Diese Technik ähnelt dem Verknüpfen von Text, mit der Ausnahme, dass Sie das Bild nicht umbrechen, sondern umbrechen:
Wenn Sie Ihrer Seite diese Art von HTML hinzufügen, dürfen Sie keine Leerzeichen zwischen dem Anchor-Tag und dem Image-Tag einfügen. Wenn Sie dies tun, fügen einige Browser kleine Häkchen neben dem Bild hinzu, was seltsam aussieht.
Das Logo fungiert jetzt auch als Homepage-Button, was heutzutage so ziemlich ein Web-Standard ist.
Beachten Sie, dass wir keine visuellen Stile wie Breite und Höhe des Bildes in unser HTML-Markup aufnehmen. Wir werden diese visuellen Stile CSS überlassen und eine saubere Trennung von HTML-Struktur und CSS-Stilen beibehalten.