Hintergrund

[Snewi133]

Hallo

wie bekomme ich auf meiner Seite http://www.Snewi.de so einen Hintergrund mit einem Streifen bei der Navigaton wie bei dieser Seite http://www.sunbeam-berlin.de/

Gruß

 

[Gumbo]

Setze es einfach als Hintergrund des body-Elements.

 

[Maik]

Hi,

dieser "Streifen" wird auf der genannten Seite mit einem Hintergrundbild im Dokumentkörper erzeugt - siehe http://www.sunbeam-berlin.de/fileadmin/templates/images/homepage_bg_body_neu_2.gif und die dazugehörige Regel im Stylesheet:

body#page-home {
	background: url(images/homepage_bg_body_neu_2.gif) repeat-x #EAE9E7;
}

 

[Snewi133]

Hallo

ich habe es genau so versucht aber irgendwie wird das Bild nicht angezeigt!
Ich habe es bei mir im body deklariert!

Gruß

 

[Maik]

Hi,

kannst du deinen Versuch mal online stellen, denn in deiner verlinkten Seite findet sich diesbezüglich nichts, und somit lässt sich derzeit nicht viel dazu sagen.

 

[Snewi133]

Hi

jetzt wird es angezeigt aber wie bekomme ich die Wiederholung des Streifens weg?

Gruß

 

[Gumbo]

Willst du denn gar nicht, dass es wie im genannten Beispiel wiederholt wird? Nimm einfach statt repeat-x no-repeat.

 

[Maik]

Du hast den Bindestrich beim Eigenschaftswert "repeat-x" vergessen, weshalb die Browser ihn als "repeat" interpretieren und das Hintergrundbild zusätzlich vertikal wiederholen, denn dieser background-repeat-Wert ist dafür vorgesehen, ein Hintergrundbild in der X- und Y-Achse zu wiederholen.

Übrigens wird im class-Attribut vor dem Klassennamen kein Punkt, wie im Klassenselektor des Stylesheets notiert, sondern der Attributswert mit einem doppelten Anführungszeichen begonnen:

<!-- aus -->

<div id="main" class=.clearfix">

<!-- wird -->

<div id="main" class="clearfix">

 

[Snewi133]

Ok
klappt nun soweit danke mal wieder für die schnelle Hilfe!
Wie kann ich das am einfachsten machen das nun die der blaue Strifen auch im Schatten angezeigt wird?

Gruß

 

[Maik]

Hi,

indem du ihn in die "Schatten-Grafik" einarbeitest.

Siehe hierzu die grafische Umsetzung auf der Seite: http://www.sunbeam-berlin.de/fileadmin/templates/images/homepage_shade2_2.gif