Der Hintergrund einer Webseite kann an ihren Inhalt gebunden sein oder sich unabhängig davon verhalten. Im ersten Fall wird beim Scrollen von Inhalten im Browserfenster auch das Hintergrundbild gescrollt, während es im zweiten Fall stationär bleiben kann. Um einen festen Seitenhintergrund zu implementieren, sollten Sie die CSS-Stilbeschreibungssprache verwenden - nur diese kann das gleiche Hintergrundverhalten in verschiedenen Browsertypen garantieren.
Anweisungen
Schritt 1
Verwenden Sie die background-attachment-Eigenschaft in CSS, um anzugeben, ob der Seitenhintergrund fest oder verschiebbar sein soll. Insgesamt kann diese Eigenschaft drei Werte haben - wenn Sie keinen davon angeben, wird der Hintergrund-Anhang standardmäßig als scroll betrachtet. Bei diesem Wert scrollt das Hintergrundbild mit dem Seiteninhalt. Der Wert inherit kopiert das Hintergrundverhalten des übergeordneten Elements, und der feste Wert macht das Hintergrundbild unabhängig vom Inhalt – es bleibt beim Scrollen der Seite stehen. Sie sollten es verwenden.
Schritt 2
Bereiten Sie Ihre CSS-Anweisungen für die Verwendung auf den Seiten vor, auf denen Sie den Hintergrund korrigieren möchten. Wenn Sie den CSS-Code nicht in eine externe Stilbeschreibungsdatei einfügen, sollten diese Anweisungen zwischen den öffnenden und schließenden Stil-Tags platziert werden:
// es wird Stilbeschreibungen geben
Die Beschreibung des Seitenhintergrundverhaltens muss an das BODY-Element gebunden sein - in der CSS-Terminologie wird es "Selektor" genannt und wird wie folgt geschrieben: BODY {
// Beschreibungen des Seitenkörpers werden hier sein
} Eigenschaften, die sich auf diesen Selektor beziehen, müssen in geschweifte Klammern gesetzt werden, getrennt durch Semikolons: BODY {
Hintergrundanhang: behoben;
Hintergrundbild: URL (Bilder / BG.gif);
} Die erste Zeile erfasst das Hintergrundbild und die zweite zeigt die Adresse der Datei mit dem Hintergrundbild relativ zur Seitenadresse an. Diese beiden Zeilen können in einer komplexen CSS-Anweisung wie folgt geschrieben werden: background: url (images / BG.gif) fixed;
Schritt 3
Fügen Sie den gesamten Code ein, um den Hintergrund in den Text der Seite einzufügen. In seiner fertigen Form kann es so aussehen:
BODY {Hintergrund: URL (Bilder / BG.gif) behoben;}
Natürlich müssen Sie den Speicherort und den Namen der Hintergrundbilddatei ersetzen. Es ist besser, den Code vor das Tag zu setzen, obwohl dies keine Voraussetzung ist.