"Shoutbox" Hintergund anpassen

Benutzer · Beitrag von **Benutzer** » 26.08.2006 21:39

Dein Quelltext sieht zur Zeit so aus:

<HEAD><META http-equiv="refresh" content="25;url=shoutbox_view.php?0?auto_refresh=1">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="http://www.kult21.de/talk/templates/NB2/shout.css" type="text/css">
<style type="text/css"> 
body { 
background-image:url(http://www.kult21.de/talk/templates/NB2/images/shoutbox.gif);
background-position: 250px 40px;
background-repeat:no-repeat; 
} 
</style> 

</HEAD

Du bindest eine externe CSS Datei ein und formatierst dies direkt im Anschluss duch eine weitere CSS Definition:

Code: Alles auswählen

<style type="text/css"> 
body { 
background-image:url(http://www.kult21.de/talk/templates/NB2/images/shoutbox.gif);
background-position: 250px 40px;
background-repeat:no-repeat; 
} 
</style>

Das heisst die letzte Definition ist massgebend und überschreibt entsprechend die vorangegangene Definition.
Lösche einfach den CSS-Teil im header Bereich und belasse es auch bei der eingebundenen CSS Datei. Diese muss natürlich die Änderungen beinhalten.

AiG · Beitrag von **AiG** » 26.08.2006 21:52

Hab ich versucht.

Dann liegt das Bild allerdings hinter den Zeilen der Tabelle.

Der BODY schaut so aus:

body {
height: 100%;
background-color: #ebebeb;
text-align: center;
padding: 0;
margin: 0
scrollbar-face-color: #CCCCCC;
scrollbar-highlight-color: #CCCCCC;
scrollbar-shadow-color: #CCCCCC;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #990000;
scrollbar-track-color: #CCCCCC;
scrollbar-darkshadow-color: #FFFFFF;
}

Benutzer · Beitrag von **Benutzer** » 26.08.2006 21:54

Ist das denn sooo schwer die Änderungen in die CSS-Datei zu kopieren?

Code: Alles auswählen

body {
height: 100%
background-color: #ebebeb;
background-image:url(beispielbild.jpg);
background-repeat:no-repeat; 
background-attachment:scroll; vertical-align:middle;
text-align: center;
padding: 0;
margin: 0
scrollbar-face-color: #CCCCCC;
scrollbar-highlight-color: #CCCCCC;
scrollbar-shadow-color: #CCCCCC;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #990000;
scrollbar-track-color: #CCCCCC;
scrollbar-darkshadow-color: #FFFFFF;
}

AiG · Beitrag von **AiG** » 26.08.2006 21:59

...natürlich nicht

Ich hatte das ja auch so und jetzt aktuell auch wieder. Wollte dir nur zeigen, wie der Code zuvor aussah.

Wobei es leider noch immer nicht klappen will.

Benutzer · Beitrag von **Benutzer** » 26.08.2006 22:08

Dann versuche dies mal:

Code: Alles auswählen

body {
height: 100%
background-color: #ebebeb;
background-image:url(beispielbild.jpg);
background-repeat:no-repeat;
background-attachment:scroll; 
background-position:middle;
text-align: center;
padding: 0;
margin: 0
scrollbar-face-color: #CCCCCC;
scrollbar-highlight-color: #CCCCCC;
scrollbar-shadow-color: #CCCCCC;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #990000;
scrollbar-track-color: #CCCCCC;
scrollbar-darkshadow-color: #FFFFFF;
}

Also dies in der CSS Datei ändern:

Code: Alles auswählen

background-attachment:scroll; 
background-position:middle;

AiG · Beitrag von **AiG** » 26.08.2006 22:13

Ahaaaaaaa, jetzt sieht das doch gleich anders aus *thumsUP*

Bekomme ich den BG, der jetzt weiß ist denn auch wieder eingefärbt > #ebebeb?

EDIT/ Dumme Frage

Klar bekomme ich > einfach das Bild anpassen

DANKE DIR!

Benutzer · Beitrag von **Benutzer** » 26.08.2006 22:23

Nimm mal den Teil in der CSS Datei raus wo in der body Definition height: 100% angegeben ist. Die Tabellen sind schon mit einer relativen Grösse angegeben, der body an sich benötigt dies doch nicht.

Versuche mal die Grafik entsprechend der gewünschten Hintergrundfarbe einzufärben. Dürfte mit einem einfachen Grafikprogramm schnell erledigt sein. Es kann aber sein das dies nicht funktioniert weil die Tabellen relative Grössen haben und das Bild statisch ist, sich also nicht so ohne weiteres den Grössen anpassen kann. Versuche es einfach mal.

Benutzer · Beitrag von **Benutzer** » 26.08.2006 22:47

Dein Quellcode der Shoutbox ist unsauber:

Code: Alles auswählen

<body bgcolor="" text="" link="" vlink="">

Das dürfte evtl. auch erklären wieso keine Hintergrundfarbe eingestellt werden kann. Wenn keine Farbe im body Teil definiert wurde, du sie also angibst und keinen Wert definierst, wird eigentlich die Standartfarbe (default) von deinem Browser (und der meisten anderen auch) angegeben, in diesem Fall dürfte es ein weisser Hintergrund sein.

Räume den Quelltext mal auf in dem du einfach nur den body Teil definierst und keine Werte dort zuteilst. Die Werte wurden doch schon in der CSS-Datei definiert.