Eine durchgehende Hintergrundfarbe einstellen Vorbereitungen zum Bearbeiten des HTML-Codes Einen Farbverlauf als Hintergrund erstellen Einen sich ändernden Hintergrund erstellen
Normalerweise sollte er relativ weit oben stehen. Tippe zwischen die body-Klammern background-color: ein. Du solltest jetzt das folgende "body" Element haben:   body {     background-color:  }   In diesem Kontext funktioniert nur eine Schreibweise von "color". Du kannst hier nicht "colour" schreiben. Tippe den numerischen Code der ausgewählten Farbe gefolgt von einem Strichpunkt neben dem Element "background-color:" ein. Um den Hintergrund deiner Seite bspw. in rosa darzustellen, würdest dein Code so aussehen:  body {     background-color: #d24dff; } Jetzt sollte der Header deiner HTML-Datei so aussehen:   <!DOCTYPE html> <html> <head> <style> body { background-color: #d24dff } </style> </head> </html> Genauso wie beim body Element kannst du mit "background-color" die Hintergründe anderer Elemente wie bspw. Überschriften, Absätzen etc. definieren. Um bspw. einer Hauptüberschrift (<h1>) oder einem Abschnitt (<p>) eine Hintergrundfarbe zu verleihen, würdest du einen Code in der Art haben:  <!DOCTYPE html> <html> <head> <style> body {     background-color: #93B874; } h1 {     background-color: #00b33c; } p {     background-color: #FFFFFF); } </style> </head> <body> <h1>Überschrift mit grünem Hintergrund</h1> <p>Absatz mit weißem Hintergrund</p> </body> </html> HTML-Farben werden durch Codes auf Basis von Nuancen definiert. Du kannst den kostenlosen HTML-Farbwähler von W3Schools verwenden, um den bzw. die Codes für die gewünschten Farben herauszufinden:  Gehe im Browser auf https://www.w3schools.com/colors/colors_picker.asp. Klicke im Bereich "Farbe auswählen" auf eine Grundfarbe. Wähle rechts auf der Seite eine Nuance. Schreibe dir den numerischen Code rechts neben der Nuance auf. Ab HTML5 wird das HTML-Attribut <bgcolor> nicht mehr unterstützt. Die Hintergrundfarbe sollte, wie alle anderen Stilaspekte deiner Seite, mit CSS gehandhabt werden. Du kannst auf einem PC Notepad++ oder Notepad nutzen, auf einem Mac TextEdit oder BBEdit. Alle Stilinformationen für deine Seite (einschließlich der Hintergrundfarbe) sollten zwischen den Tags <style></style> angegeben werden:  <!DOCTYPE html> <html> <head> <style> </style>  </head> </html> Du solltest eine Zeile haben, auf der du unter dem <style> Tag und über dem </style> Tag Informationen eingeben kannst. Tippe dies zwischen die Tags <style></style> ein:   body {  }   Alles, was du im "body" Element in CSS angibst, beeinflusst die gesamte Seite. Überspringe diesen Schritt, wenn du einen Farbverlauf erstellen möchtest. Du solltest ihn ziemlich weit oben im Code finden. Bei der Erstellung eines Farbverlaufs (auch Gradient genannt) brauchst du zwei Informationen: Den Anfangspunkt/Winkel und die Farben, zwischen denen der Gradient verlaufen soll. Du kannst mehrere Farben  auswählen, um den Gradienten zwischen ihnen allen verlaufen zu lassen, und du kannst eine Richtung oder einen Winkel für den Farbverlauf einstellen.  background: linear-gradient(direction/angle, color1, color2, color3, etc.); Wenn du die Richtung nicht angibst, verläuft der Farbverlauf von oben nach unten. Um deinen Farbverlauf zu erstellen, füge den folgenden Code zwischen den <style></style> Tags ein:   html {     min-height: 100%;  } body {     background: -webkit-linear-gradient(#93B874, #C9DCB9);      background: -o-linear-gradient(#93B874, #C9DCB9);      background: -moz-linear-gradient(#93B874, #C9DCB9);      background: linear-gradient(#93B874, #C9DCB9);      background-color: #93B874;  }   Verschiedene Browser haben verschiedene Implementierungen der Gradientenfunktion, daher musst du verschiedene Versionen des Codes einfügen. Wenn du lieber einen Farbverlauf hast, der nicht streng vertikal verläuft, kannst du ihm eine Richtung geben, um die Art zu verändern, wie der Farbwechsel auftritt. Tippe dafür das Folgende zwischen die <style></style> Tags ein:   html {     min-height: 100%; }  body {     background: -webkit-linear-gradient(left, #93B874, #C9DCB9);      background: -o-linear-gradient(right, #93B874, #C9DCB9);      background: -moz-linear-gradient(right, #93B874, #C9DCB9);      background: linear-gradient(to right, #93B874, #C9DCB9);      background-color: #93B874;  }   Du kannst mit den Tags "left" und "right" herumspielen, um mit verschiedenen Richtungen für deinen Farbverlauf zu experimentieren. Dies lässt die Farbe verblassen. Verwende die gleiche Farbe, um von der Farbe auf nichts zu verblassen. Du musst die Funktion rgba() nutzen, um die Farbe zu definieren. Der Endwert bestimmt die Transparenz: 0 für durchgehend und 1 für transparent.  background: linear-gradient(to right, rgba(147,184,116,0), rgba(147,184,116,1)); Der Code, um einen Farbverlauf als Hintergrund für deine Webseite zu erzeugen, sieht etwa so aus:  <!DOCTYPE html> <html> <head> <style> html {     min-height: 100%; }   body {     background: -webkit-linear-gradient(left, #93B874, #C9DCB9);      background: -o-linear-gradient(right, #93B874, #C9DCB9);     background: -moz-linear-gradient(right, #93B874, #C9DCB9);      background: linear-gradient(to right, #93B874, #C9DCB9);      background-color: #93B874;  } </style> </head> <body> </body> </html> Er sollte irgendwo oben auf der Seite stehen. Tippe dies in den Platz unter "body {" und über der schließenden Klammer ein:       -webkit-animation: colorchange 60s infinite;      animation: colorchange 60s infinite;   Die oberste Zeile des Texts ist für Chromium-basierte Browser, während die untere Textzeile für andere Browser ist. Jetzt wirst du die @keyframes Regel nutzen, um die Hintergrundfarben festzulegen, durch die du wechseln wirst, sowie die Dauer, die jede Farbe auf der Seite angezeigt wird. Auch hier musst du die Einträge für die verschiedenen Browser-Sets trennen. Gib die folgenden Zeilen Code unter der schließenden "body" Klammer ein:   @-webkit-keyframes colorchange {      0%  {background: #33FFF3;}     25%  {background: #78281F;}     50%  {background: #117A65;}     75%  {background: #DC7633;}     100% {background: #9B59B6;} } @keyframes colorchange {      0%  {background: #33FFF3;}     25%  {background: #78281F;}     50%  {background: #117A65;}     75%  {background: #DC7633;}     100% {background: #9B59B6;} }    Beachte, dass die beiden Regeln (@-webkit-keyframes und @keyframes die gleichen Hintergrundfarben und Prozentzahlen haben. Diese sollten einheitlich bleiben, damit das Erlebnis auf allen Browsern gleich ist. Die Prozentzahlen (0%, 25% etc.) beziehen sich auf die gesamte Animationsdauer (60s). Wenn die Seite geladen wird, ist der Hintergrund die bei 0% eingestellte Farbe (#33FFF3). Sobald die Animation 25 % von 60 Sekunden abgespielt hat, wechselt der Hintergrund auf #7821F und so weiter.  Du kannst die Zeiten und Farben nach deinen Wünschen ändern. Dein gesamter Code zum Ändern der Hintergrundfarbe sollte in etwa so aussehen:  <!DOCTYPE html> <html> <head> <style> body {     -webkit-animation: colorchange 60s infinite;      animation: colorchange 60s infinite; } @-webkit-keyframes colorchange {      0%  {background: #33FFF3;}     25%  {background: #78281F;}     50%  {background: #117A65;}     75%  {background: #DC7633;}     100% {background: #9B59B6;} } @keyframes colorchange {      0%  {background: #33FFF3;}     25%  {background: #78281F;}     50%  {background: #117A65;}     75%  {background: #DC7633;}     100% {background: #9B59B6;} }    </style> </head> <body> </body> </html>
Finde den "html" Header in deinem Dokument. Füge dem Element "body" die Eigenschaft "background-color" hinzu.  Füge die gewünschte Hintergrundfarbe in die Eigenschaft "background-color" ein. Sieh dir deine "style" Informationen an. Wende mit "background-color" eine Hintergrundfarbe auf andere Elemente an. Bestimme die gewünschte Hintergrundfarbe. Öffne deine HTML-Datei in deinem bevorzugten Texteditor. Füge den "html" Header in dein Dokument ein. Erstelle zwischen den "style" Tags eine neue Zeile. Füge das "body" Element ein. Finde den "html" Header in deinem Dokument. Verstehe die grundlegende Syntax dieses Prozesses. Erstelle einen vertikalen Farbverlauf.  Erstelle einen gerichteten Farbverlauf. Verleihe deinen Farben Transparenz. Sieh dir den fertigen Code an. Finde den html Header in deinem Code.  Füge die Animationseigenschaft ins "body" Element ein.  Füge der Animation deine Farben hinzu.  Sieh dir deinen Code an.
https://www.wikihow.com/Set-Background-Color-in-HTML https://www.wikihow.com/Set-Background-Color-in-HTML https://www.wikihow.com/Set-Background-Color-in-HTML https://www.wikihow.com/Set-Background-Color-in-HTML
Setting a Solid Background Color Preparing to Edit Your HTML Creating a Gradient Background Creating a Changing Background