Hallo zusammen,
gibt es eine Möglichkeit im Style-Sheet eines Themes mehrere Links in einem Bild zu setzen? Wenn man beispielsweise eine Headergrafik als einzelnes Bild gestaltet, dieses Bild aber meinetwegen drei Logs oder ähnliches beinhaltet, wäre es dann möglich per CSS diese drei Bilder mit jeweils einem eigenen Link zu bestücken?
Beste Grüße
Martin
Header mit Links versehen
-
-
- Gerade eben
- Anzeige
Hallo!
Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.
- ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
- ✔️ Deutsche Server & DSGVO-konform
- ✔️ Persönlicher Support (kein 0815-Ticket-System)
-
Per CSS kann man keine Links festlegen.
Aber man kann z.B. eine Imagemap benutzen, das Headerbild in drei einzelne Bilder stückeln und jeweils verlinken, "blinde" DIV-Container über das Bild zu legen und diese zu verlinken... -
Klingt furchtbar kompliziert. Wäre mal ein Beispiel für eine solche Imagemap möglich und kann man den Code dann überhaupt in das Stylesheet schreiben?
-
-
Ah! Sehr schöner Hinweis, danke. Nun ist aber noch folgendes:
Der Code für die Headergrafik im Stylesheet sieht folgendermaßen aus:
#header {
width: 900px;
height: 180px;
margin: 0 auto;
background:#000 url(images/703848.jpg) no-repeat right;
}
Lassen sich die entsprechenden HTML-Notationen dann einfach mit in die Klammer integrieren oder müssen die an anderer Stelle gesetzt werden? -
Ich habe einfach mal folgendes in das Stylesheet geschrieben, allerdings hat das nicht funktioniert. Das Bild wurde zwar richtig angezeigt, aber da waren keine Links zu finden.
#header {
width: 900px;
height: 180px;
margin: 0 auto;
background:#000
<img src="703848.jpg" width="900" height="180" border="0" alt="header" usemap="#header">
<map name="header">
<area shape="rect" coords="37,47,160,122"
href="test.de - Stiftung Warentest" alt="test" title="test">
</map>
} -
wenn du das nicht kannst oder verstehst, solltest du es machen, wie jottlieb geschrieben hat!
das headerbild in einzelne bilder zerteilen und einzeln verlinken -
Alles anzeigen
Ich habe einfach mal folgendes in das Stylesheet geschrieben, allerdings hat das nicht funktioniert. Das Bild wurde zwar richtig angezeigt, aber da waren keine Links zu finden.
#header {
width: 900px;
height: 180px;
margin: 0 auto;
background:#000
<img src="703848.jpg" width="900" height="180" border="0" alt="header" usemap="#header">
<map name="header">
<area shape="rect" coords="37,47,160,122"
href="test.de - Stiftung Warentest" alt="test" title="test">
</map>
}
Was jetzt? Du hast es in die css geschrieben? Der HTML-Code gehört in keine CSS sondern in die header.php Deines Themes (und ersetzt die bisherige Grafik). Und mit coords="37,47,160,122" legst Du die einzelnen Koordinaten der verschiedenen Bereiche fest. -
Super vielen Dank für die Hinweise! Hat alles wunderbar funktioniert!
Danke!
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!