Cascading Style Sheets (CSS)

Style Sheet Syntax

Eigenschaften: Hintergrund

Das Thema "Hintergrund" ist natürlich sehr dankbar, denn da gibt's schnell sichtbare Resultate. Als wichtigste Punkte zum Einstieg halten wir fest,

dass der Hintergrund mit zwei Komponenten gestaltet werden kann: einer Hintergrund-Farbe und einem Hintergrund-Bild.
dass das Hintergrund-Bild wahlweise nur einmal vorhanden sein oder waag- und senkrecht wiederholt werden kann
dass die Hintergrundsdefinitionen nicht nur für <body> sondern für jedes HTML-Element gemacht werden können.

Und hier sind die Details:

background-color	Die Hintergrundfarbe kann angegeben werden, wie alle Farben: mit ihrem Namen oder mit Rot-, Grün- und Blau-Anteilen. Eine spezielle Farbe, die zugleich Standardannahme ist, ist `transparent`
background-image	Damit wird das Hintergrundsbild angegeben. Die Syntax ist etwas gewöhnungsbedürftig; hier ist ein Beispiel: `background-image: url(meinbild.jpg) ;` Die URL des Bildes wird entweder absolut angegeben, oder relativ zum Style Sheet (was aber Netscape 4.x nicht kann). Es empfiehlt sich, zusammen mit einem Hintergrundbild immer auch eine Hintergrundfarbe zu bestimmen.
background-attachment	kann `scroll` oder `fixed` sein und steuert, ob das Hintergrundsbild die Scroll-Bewegung auf dem Schirm mitmacht (standard) oder an seiner Stelle fixiert bleibt.
background-repeat	kann vier Werte annehmen: `repeat` ist die Standardannahme, und sie bedeutet, dass ein Hintergrundbild waagrecht und senkrecht so oft repetiert wird, dass es die ganze Fläche ausfüllt. `no-repeat` bedeutet, dass das Hintergrundbild nur ein einziges Mal verwendet wird. Das ist vor allem für wirkliche Bilder (im Gegensatz zu "Mustern") sinnvoll. `repeat-x` bedeutet, dass das Bild nur horizontal wiederholt wird. Damit entsteht ein waagrechtes Band. `repeat-y` bedeutet, dass das Bild nur vertikal wiederholt wird. Damit entsteht ein senkrechtes Band.
background-position	kann verwendet werden, um das Hintergrundbild ausdrücklich zu platzieren. Dazu gibt es drei Methoden: mit zwei Massen (em, px etc) kann die linke obere Ecke positioniert werden mit zwei Prozentzahlen geht was ähnliches: Die Stelle x% von oben und y% von links im Bild wird auf die Stelle x% von oben und y% von links im Element ausgerichtet. Eine Kombination der Worte `top` oder `bottom` mit `left, right` oder`center`positioniert das Bild entsprechend.
background	Hier handelt es sich um eine vereinfachte Notation. Die Keywords der oben besprochenen Eigenschaften können samt und sonders (mit Leerzeichen getrennt) der background-Eigenschaft zugeordnet werden.

Intro Wasist Wodenn Wiedenn FrontPage das Box-Modell CSS Syntax Selektoren Schrift Hintergrund Anhang Farben Masse