HTML Bilder als Links über andere Bilder legen

thomo

Cadet 3rd Year
Registriert
Dez. 2002
Beiträge
33
Hallo zusammen,

ich soll auf einer Homepage ein wenig verändern und hab bisher rudimentäre HTML Kenntnisse. Es geht sich um dieses Bild:

2339f743-657a-4d7e-8b0e-9f9c89e9fc00.jpeg

Ich würde jetzt gerne den Text innerhalb der hellblauen Post-Its in Links umwandeln. Wie genau ist mir im Prinzip egal. Meine Idee wäre auf Anhieb gewesen, das Bild aufzuspalten. Auf der einen Seite die Post-Its als einzelne Bilder und auf der anderen der ganze Rest als einzelnes Bild, da ich das auch so einzeln habe. Dann würde ich den Rest an die entsprechende Stelle der Seite setzen, die Post-Its mittels
HTML:
<a href="link"><img src="bild.jpg"/></a>
als Links verwenden und die Post-Its dann einfach über das restliche Bild an die entsprechenden Positionen legen. Da bin ich auf folgendes gestoßen:
HTML:
<img src="meinbild.png" style="position:relative; top: 20px; left: 50px;"></img>
Genau da liegt aber mein Problem, ich kriege die Befehle irgendwie nicht richtig zusammen, sodass genau das bei rauskommt, das ich brauche. Entweder werden die Post-Its falsch oder erst gar nicht angezeigt, die Verlinkung geht kaputt oder oder oder.. könntet ihr mir da vielleicht weiterhelfen? Ich bin für jede Hilfe dankbar, gerne auch für andere Lösungvorschläge (z.B. indem man nur die Schrift auf den Post-Its als Links nimmt, falls das einfacher geht, etc) :)

Also schon mal vielen Dank von meiner Seite!

Gruß,
Thomas
 
Also eigentlich ist das mit ein bisschen CSS gar kein Problem, aber vielleicht fällt es dir mit einer Map leichter. Da brauchst du erst gar nichts zerstückeln.
 
Würd auch sagen, nimm eine Map. Ist deutlich leichter zu handhaben als eine CSS-Lösung und semantisch sogar besser.
 
Alles klar, das klingt schon mal gut. Ich werde es mir nachher direkt mal anschauen, dank euch beiden schon mal :)
Ergänzung ()

Tausend Dank Jungs!! Der Tipp, eine Map zu verwenden, war absolut goldrichtig :) Geht leicht und schnell von der Hand und ist 100x einfacher, als meine umstaendliche Methode. Daumen hoch :daumen:
 
Zurück
Oben