---
title: "CSS-Image-Menue"
url: "https://www.typo3.net/d/34248-css-image-menue"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage"]
created: "2005-12-02"
last_reply: "2006-01-24"
replies: 2
solved: false
page: 1
pages: 1
lang: "de"
---

# CSS-Image-Menue

TYPO3 › Menüs · 2 Antworten · gestartet 2005-12-02

## Eröffnungsbeitrag

**typographic** · 2005-12-02 · [Beitrag #1](https://www.typo3.net/d/34248-css-image-menue/1)

Hallo!

Folgendes Problem:

ich möchte eine Navigation bestehend aus Images realisieren.
Die Images (normal und hover) werden im Backend über das Seiten-modul (Einstellung: 'Erweitert') in die DB geschrieben.
Zu finden ist das Bild dann auch im Ordner /uploads/media/image.jpeg

Einbinden möchte ich das Bild mithilfe von CSS und das sollte dann so (fetig gerendert) aussehen:

```html
<span style="background:url(uploads/media/image.jpeg);">Link 1</span>
```

wie kann ich das dynamisch mittels typocript einbinden?

```typoscript
  ...
  marks.SUBMENU.1.NO {
    linkWrap = <span style="background:url(uploads/media/???)">|</span>
    wrapItemAndSub = <li>|</li>
  }
  ...
```

dank schon mal für eure Zeit

mfG

## Antworten

### [#2](https://www.typo3.net/d/34248-css-image-menue/2) · theo · 2005-12-02

[/d/9850-bilder-fuer-einzelne-kategorien/2](https://www.typo3.net/d/9850-bilder-fuer-einzelne-kategorien/2)
mit den Infos unter Punkt 2.) kannst Du sicherlich was anfangen...  ;)

### [#3](https://www.typo3.net/d/34248-css-image-menue/3) · typographic · 2006-01-24

*NACHOBENSCHIEB*

Hallo! - danke dür den Tipp!
irgendwie bekomme ich die Geschichte doch nicht zum laufen:

mein Typoscript für das Untermenü:

```typoscript
  #
  # Submenu LEVEL 1
  #
  marks.SUBMENU = HMENU
  marks.SUBMENU.entryLevel = 1
  marks.SUBMENU.1 = TMENU
  marks.SUBMENU.1.wrap = <ul class="submenu">|</ul>
  marks.SUBMENU.1.NO {
    linkWrap = <span>|</span>
    wrapItemAndSub = <li>|</li>
  }
  marks.SUBMENU.1.ACT = 1
  marks.SUBMENU.1.ACT {
    linkWrap = <span class="active">|</span>
    wrapItemAndSub = <li class="active">|</li>
  }
```

liefert folgendes Ergebnis:

```html
<ul class="submenu">
  <li><span><a href="who/knows/">submenu link1</a></span></li>
  <li><span><a href="any/where/">submenu link2</a></span></li>
</ul>
```

gewünschtes Ergebnis:

```html
<ul class="submenu">
  <li><span style="background:url(uploads/media/menuimg1.jpg) display:block; height:20px; width:100px;"><a href="who/knows/">submenu link1</a></span></li>
  <li><span style="background:url(uploads/media/anotherimg.jpg) display:block; height:20px; width:100px;"><a href="who/knows/">submenu link2</a></span></li>
</ul>
```

oder noch besser wäre es die Anweisungen direkt in den link unterzubringen:

```html
...
  <li><a style="background:url(uploads/media/img.jpg); display:block; height:20px; width:200px;" href="...">submenu link</a></li>
...
```

danke schon mal im vorraus

---

Quelle: „CSS-Image-Menue“, typo3.net, https://www.typo3.net/d/34248-css-image-menue
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.
