So legen Sie den CSS-Hintergrund fest

CSS ermöglicht die Anwendung einer Volltonfarbe als Hintergrund sowie die Erstellung recht komplexer Effekte mithilfe von Hintergrundbildern.

CSS ist in dieser Hinsicht HTML weit überlegen. (Empfohlenes Lernen: CSS-Grundlagen-Tutorial)

Hintergrundfarbe

Mit dem Attribut „background-color“ können Sie die Hintergrundfarbe für ein Element festlegen . Diese Eigenschaft akzeptiert jeden zulässigen Farbwert.

Diese Regel setzt den Hintergrund des Elements auf Grau:

p {background-color: gray;}

Wenn Sie möchten, dass die Hintergrundfarbe weniger über den Text im Element hinausragt, fügen Sie einfach etwas hinzu Padding:

p {background-color: gray; padding: 20px;}

kann die Hintergrundfarbe für alle Elemente festlegen, einschließlich des Körpers bis hin zu Inline-Elementen wie em und a.

Hintergrundfarbe kann nicht vererbt werden und der Standardwert ist transparent. Transparent bedeutet „transparent“. Das heißt, wenn ein Element keine Hintergrundfarbe angibt, ist der Hintergrund transparent, sodass der Hintergrund seiner Vorgängerelemente sichtbar ist.

Hintergrundbild

Um ein Bild in den Hintergrund zu stellen, müssen Sie das Attribut „Hintergrundbild“ verwenden. Der Standardwert der Eigenschaft „Hintergrundbild“ ist „none“, was bedeutet, dass kein Bild im Hintergrund platziert wird.

Wenn Sie ein Hintergrundbild festlegen müssen, müssen Sie einen URL-Wert für dieses Attribut festlegen:

body {background-image: url(/i/eg_bg_04.gif);}

Die meisten Hintergründe werden auf das Körperelement angewendet, dies ist jedoch der Fall darauf nicht beschränkt.

Das folgende Beispiel wendet einen Hintergrund auf einen Absatz an, ohne einen Hintergrund auf den Rest des Dokuments anzuwenden:

p.flower {background-image: url(/i/eg_bg_03.gif);}

Sie können sogar ein Hintergrundbild für Inline-Elemente festlegen, Das folgende Beispiel legt ein Hintergrundbild für einen Link fest:

a.radio {background-image: url(/i/eg_bg_07.gif);}

Theoretisch ist es sogar möglich, ein Bild auf den Hintergrund von Ersatzelementen wie Textareas und Select anzuwenden, aber nicht auf alle Benutzeragenten können mit der Situation gut umgehen.

Außerdem möchte ich hinzufügen, dass das Hintergrundbild nicht vererbt werden kann. Tatsächlich werden nicht alle Hintergrundeigenschaften vererbt.

Das obige ist der detaillierte Inhalt vonSo legen Sie den CSS-Hintergrund fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!