Heim >Web-Frontend >CSS-Tutorial >So implementieren Sie ein festes Hintergrundbild in CSS
So implementieren Sie ein festes Hintergrundbild in CSS
- 藏色散人Original
- 2018-12-01 15:18:5710124Durchsuche
Das sogenannte feste Hintergrundbild bedeutet, dass sich das Hintergrundbild nicht ändert, wenn wir Inhalte auf der Seite eingeben oder die Maus bewegen. Es ist auch sehr einfach, die Hintergrundbildfixierung in CSS zu implementieren. Dazu können wir die hintergrundbezogenen Attribute in CSS verwenden.
Empfohlene Referenz: „CSS-Tutorial“
Dann haben wir es Ihnen im vorherigen Artikel vorgestelltSo erzielen Sie mit CSS einen Hintergrundbildwiederholungseffekt.
Jetzt stellen wir Ihnen weiterhin die Implementierungsmethode der CSS-Hintergrundbildfixierung vor.
Der Code lautet wie folgt:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title></title>
<style type="text/css">
body {
background-image: url("/test/img/154e.png");
background-repeat: no-repeat;
background-attachment: fixed;
}
</style>
</head>
<body>
<p>这里是一行文字：圣诞节快乐！</p>
<p>这里是一行文字：圣诞节快乐！</p>
<p>这里是一行文字：圣诞节快乐！</p>
<p>这里是一行文字：圣诞节快乐！</p>
<p>这里是一行文字：圣诞节快乐！</p>
<p>这里是一行文字：圣诞节快乐！</p>
</body>
</html>Der Effekt ist wie folgt:
Hintergrundbezogene Attribute:
background-attachment attribute Legt fest, ob das Hintergrundbild fixiert ist oder mit dem Rest der Seite scrollt. Der Wert „fixed“ bedeutet, dass sich das Hintergrundbild nicht bewegt, wenn der Rest der Seite gescrollt wird.
Hintergrundwiederholungsattribut legt fest, ob und wie das Hintergrundbild wiederholt werden soll.
Dieser Artikel ist eine Einführung in die Methode zum Korrigieren von Hintergrundbildern mit CSS. Er ist einfach und leicht zu verstehen. Ich hoffe, er wird für Freunde in Not hilfreich sein.
Das obige ist der detaillierte Inhalt vonSo implementieren Sie ein festes Hintergrundbild in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!