CSS Hintergrundbild richtig einfügen (vollbild) | CSS Tutorial Deutsch

Mit dem Coupon-Code: KURZUNDKNAPP
sparst du 10% Rabatt auf alle Webhosting-Pakete mit einer Laufzeit von 12 Monaten und mehr.

*Hier kannst du die nötigen Einstellungen kopieren:*

height: 100%; /*Für html und body*/
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;

In dem Video lernst du, wie du ein Hintergrundbild richtig einfügen kannst. Das Bild ist der Hintergrund für die ganze Webseite und soll sie vollständig ausfüllen. Außerdem lernst du wie man einen Gradient über das Hintergrundbild macht.

Song: Fredji - Flying High (Vlog No Copyright Music)
Music provided by Vlog No Copyright Music.

Link zum im Video verwendeten Hintergrundbild:

[sinanfischer]

Super schnelle und verständliche Erklärung! Hoffe deine Videos und dein Kanal bekommt mehr Reichweite mit der Zeit. Bin mir sicher wenn du dran bleibst sollte dir nichts im Wege stehen und deine Videos helfen einfach so krass weiter. Danke ! 🙌🙌

[tatjanadumler]

Ich danke Dir sehr, genau das brauchte ich.

[DaIsserSchon]

Vielen Dank für das "Tut" und alle anderen auf deinem Kanal. Nett wäre auch ein Video zum einem Background-Slider.

[lactoes]

HILFE!
mein Gradient verdeckt nicht das ganze Bild. Wie löse ich dieses Problem. Oder wie kann man die Größe von dem Gradient einstellen.

[sebastiangopfert]

Wie schaffe ich es, dass ich unter dem Hintergrundbild weiter schreiben kann?

[Saftiges_Brot]

Bei mir funktioniert leider dieser Filter über der Webside, also der linear-gradient nicht! Sonst allerdings ein sehr gelungenes Tutorial.

[lael]

Gibt es eine Reihenfolge die zu beachten ist wenn man alle Eigenschaften direkt nur mit "Background:" aufrufen/eingeben will?
Background-color, -image, -repeat lassen sich ohne Probleme hintereinander in Background angeben und funktionieren, aber sobald -size und -attachment (also deren Werte natürlich) angegeben werden, krise! ^^

[Sven-Gross]

moin, ja sie haben mir geholfen danke

[J-]

Welche Gründe kann es geben, dass das nicht funktioniert? Alle Elemente meiner CSS funktionieren nur dieses body Element nicht? Wenn ich die selbe Box in ein <Style> child setze funktioniert aber alles?

[fragmatic]

Ich habe auf meiner Website ein Grid erstellt für Navigationsleiste, sidebar, footer etc. Ich möchte aber dass das Hintergrund für alle Bereiche sichtbar ist so wie in dem Video. Wo gebe ich dann diese Einstellungen ein?

[jxnas]

welche größe bzw auflösung(also wieviel px mal px) sollte das Hintergrundbild haben?