---
title: "Hintergrundbild mittig zentriert - Wie?"
url: "https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie"
source: "typo3.net"
tags: ["Frontend","Styling","Frage","HTML & CSS"]
created: "2006-06-15"
last_reply: "2006-06-21"
replies: 7
solved: false
page: 1
pages: 1
lang: "de"
---

# Hintergrundbild mittig zentriert - Wie?

Frontend › Styling · 7 Antworten · gestartet 2006-06-15

## Eröffnungsbeitrag

**laufkraft** · 2006-06-15 · [Beitrag #1](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/1)

Hallo,

ich habe woanders gelesen, dass es möglich ist das Hintergrundbild einer Seite mittig zu fixieren:

Hintergrundbild in der Seitenmitte fixiert:

<body style="background: #ffffff url(../images/hintergrundbild.gif) no-repeat fixed center center;">>

Wie mache ich das mit typo? Hat da einer eine Ahnung?

## Antworten

### [#2](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/2) · steffenk · 2006-06-15

das hat nichts mit Typo3 zu tun sondern ist reines CSS.

### [#3](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/3) · miwolfram · 2006-06-16

...sprich du nimmst einfach dein externes Stylesheet und haust eine Definition für den Bodytag rein.

z.B. meineStyles.css:

```html
body {
background: #ffffff url(../images/hintergrundbild.gif) no-repeat fixed center center;
}
```

Und pass auf dass der Pfad zu deinem Hintergrundbild stimmt, also z.B. "(fileadmin/images/hintergrundbild.gif)".

Wie du ein externes Stylesheet in Typo3 einbinden kannst ->Suche benutzen (Stichwort "externes CSS einbinden")

### [#4](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/4) · wezpe · 2006-06-16

Am besten ist die Lösung mit dem Externen CSS. Du kannst aber auch den Bodytag selbst schreiben

```typoscript
page.bodyTag = <body style="background: #ffffff url(../images/hintergrundbild.gif) no-repeat fixed center center;">
```

### [#5](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/5) · laufkraft · 2006-06-21

OK... ich versuche gerade meine Seite auf externes CSS umzubauen, aber irgendwie will das nicht. Im Quelltext der Seite erscheint immer

</head>
<body bgcolor="#FFFFFF">

obwohl ich im CSS was anderes angebe. Der Pfad zum CSS ist richtig, weil andere Einstellungen übernommen werden.

Ebenso schaffe ich es nicht meine einzelnen Marker ###MARKER### mit CSS einzeln anzusprechen indem ich sie in <div id="...">###MARKER###</div> reinpacke...

Auch mit den Menüs habe ich Probleme. Die CSS wird nur teilweise übernommen, z.B. sollte das linke Menü schwarz sein, ist aber weiß...

Ich glaub ich brauch hier dringend eure Hilfe!

Setup:

```typoscript
page {
     typeNum = 0
     meta.AUTHOR = ...
     meta.DESCRIPTION = Christina...
     stylesheet = fileadmin/christina/style.css 
     ...
    # Designvorlage integrieren
     10 = TEMPLATE
     10.template = FILE 
     10.template.file = fileadmin/christina/vorlage.htm 
     10.workOnSubpart = DOKUMENT
...
           # Das Linke Text-Menü "links"
     MENU_LINKS = HMENU
     MENU_LINKS  {
          special = directory
          special.value = 654
          1 = TMENU
          1 {
              wrap = <span id="menu_links"><ul>|</ul></span>
              NO {
                  wrapItemAndSub = <li> | </li>
                   }
              }     
           }

# Das Textmenü oben erstellen
       MENU_OBEN = HMENU
       MENU_OBEN {
          special = directory
          special.value = 655
          1 = TMENU
          wrap = <span id="menu_oben">|</span>
          1.NO = 1
          1.NO.linkWrap =  |        
          #1.NO.beforeImg = fileadmin/christina/design/bullet.GIF

          }
```

CSS:

```html
body {
bgcolor:#B20000;
topmargin:0;
leftmargin:0;
}

#menu_links ul,ol,li,a{
   font-family:Verdana,sans-serif; 
   font-size:11pt; 
   font-variant:small-caps;
   font-weight:500;
   color:#000000;
   margin:5px;
   margin-bottom:16px; 
   list-style-image:none;
   text-decoration:none;
   }

#menu_oben p,a{
   font-family:Verdana,sans-serif; 
   font-size:11pt; 
   font-variant:small-caps;
   font-weight:500;
   color:#FFFFFF;
   margin:0px; 
   margin-bottom:0px; 
   text-decoration:none;
   }


#content p,a {font-family: Arial;
	color: #000000;
                font-size: 10pt;
}

#banner_unten p,a {font-family: Arial;
	color: #FFFFFF;
                font-size: 10pt;
}
```

### [#6](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/6) · miwolfram · 2006-06-21

> **laufkraft schrieb:**
>
> Im Quelltext der Seite erscheint immer
>
> </head>
> <body bgcolor="#FFFFFF">
>
> obwohl ich im CSS was anderes angebe.

Dann wirst du das irgendwo im Template reingeschrieben haben.
Wenn dus nicht findest definiere mit

```typoscript
page.bodyTag =
```

das BodyTag anders.
Was du im CSS angibst ist wurscht, das wird ja deshalb nicht in den Quelltext geschrieben.

> **laufkraft schrieb:**
>
> Der Pfad zum CSS ist richtig, weil andere Einstellungen übernommen werden.

Ob der Pfad richtig ist siehst du eh im Quelltext.

> **laufkraft schrieb:**
>
> Ebenso schaffe ich es nicht meine einzelnen Marker ###MARKER### mit CSS einzeln anzusprechen indem ich sie in <div id="...">###MARKER###</div> reinpacke...

Wenn im Quellcode die einzelnen Bereiche zwischen Divs stehen und eine entsprechende id zugewiesen ist kannst du sie auch per CSS ansprechen (sofern dein CSS-File richtig eingebunden ist).

Alles was der Browser als Quelltext erhält wird ausgewertet, nicht mehr und nicht weniger.

> **laufkraft schrieb:**
>
> Auch mit den Menüs habe ich Probleme. Die CSS wird nur teilweise übernommen, z.B. sollte das linke Menü schwarz sein, ist aber weiß...

Span-Tags sind InlineElemente und dürfen keine Blockelemente enthalten.
Nimm ein Div statt ein Span-Tag.
-> <http://de.selfhtml.org/html/referenz/elemente.htm>
-> <http://www.css4you.de>

### [#7](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/7) · laufkraft · 2006-06-21

Das CSS hab ich mit

```typoscript
     stylesheet = fileadmin/christina/style.css
```

im setup und habe css-styled-content ausgewählt...

Im template hab ich nichts dergleichen (wie page.bodyTag) ausgewählt, im Gegenteil, ich hatte es drin und habs dann rausgenommen!

was muss man sonst noch tun? Ich dachte das wärs...
bin echt am verzweifeln...

### [#8](https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie/8) · miwolfram · 2006-06-21

jetzt lies dir nochmal mein voriges Statement durch!  #evil#

Schau im Quelltext (Browser!) nach ob das Stylesheet richtig eingebunden wird.

Und tausch das Span-Tag mit einem DIV aus. So kanns auf keinen Fall funktionieren!!!

Zum letzten Mal:
Wenn etwas im Quelltext drinnensteht wird es auch vom Browser ausgewertet.

Zur Problemlösung:
Entweder das Stylesheet wird nicht eingebunden, deine Tags sind falsch oder dein CSS.

Speichere die Seite lokal, ändere es um dass es funktioniert und dann mach das in Typo3.

---

Quelle: „Hintergrundbild mittig zentriert - Wie?“, typo3.net, https://www.typo3.net/d/44827-hintergrundbild-mittig-zentriert-wie
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.