Wie ändere ich die Farbe einer Box div (HTML)

Ich versuche, eine Website zu erstellen und meine Informationen in Boxen zu trennen. Ich versuche, die Farbe jeder einzelnen Box zu ändern, aber es funktioniert nicht. Hier ist mein Code. Das und versucht, die Farbe des div zu ändern.Wie ändere ich die Farbe einer Box div (HTML)

Danke.

<!DOCTYPE html> 
    <html> 
    <head> 
    <title>Blank</title> 



***<!--Box--> 
    <style>.boxed { 
     border: 1px solid black ; 
     margin-top: 20px; 
     margin-left: 50px; 
     margin-right: 50px; 
     padding-left: 20px; 
      padding-right: 20px; 
    } 
     </style>*** 


    </head> 

    <body> 
    <main> 
    </main> 



    <font face="caslon"> 
    <color background: green> 
    <div class="boxed"> 
     <h1> <font face="caslon", style="font-weight:bold">How is electricity produced?</font></h1> 
    <p style="font-weight:normal">There are multiple ways electricity can be produced that thave been found over the course of history. They differ in their efficency and cost.</p> 
    <p style="font-weight:normal">They include: </p> 
    </div> 
    </color> 


    <color background: red> 
    <div class="boxed"> 
     <h3><p style="font-weight:bold">Static electricity</p></h3> 
     <p style="font-weight:normal"> 
    Static electricity is produced by bringing two different materials into contact. This causes a phenomenon known as triboelectricity (or the triboelectric effect). All materials are made of atoms with a positive nucleus and negative electrons orbiting. Some atoms have a stronger pull on these electrons than others. When we bring the two materials into contact one may have a stronger pull on the electrons. When we separate them, electrons can stick to the material with a stronger pull. This results in a material with more electrons and results in static electricity. 
    </p> 
    </div> 
    </color> 

    </font> 
    </body> 
    </html>

Quelle

2017-04-11 AEON

Haben Sie sogar versucht, es zu googeln? – Mazz

Sie müssen Stil jedes div mit einem background-color

Versuchen Sie diese style="background-color:YourColorCode;" zu Ihrem div hinzuzufügen.

Zum besseren Verständnis auf font-face finden diese link

Siehe unten Snippet:

.boxed { 
 
     border: 1px solid black ; 
 
     margin-top: 20px; 
 
     margin-left: 50px; 
 
     margin-right: 50px; 
 
     padding-left: 20px; 
 
     padding-right: 20px; 
 
    }

<body> 
 
     <main> 
 
     </main> 
 
     <div class="boxed" style="background-color:green;"> 
 
     <h1><font style="font-weight:bold">How is electricity produced?</font></h1> 
 
    <p style="font-weight:normal">There are multiple ways electricity can be produced that thave been found over the course of history. They differ in their efficency and cost.</p> 
 
    <p style="font-weight:normal">They include: </p> 
 
    </div> 
 
    <div class="boxed" style="background-color:red"> 
 
     <h3><p style="font-weight:bold">Static electricity</p></h3> 
 
     <p style="font-weight:normal"> 
 
    Static electricity is produced by bringing two different materials into contact. This causes a phenomenon known as triboelectricity (or the triboelectric effect). All materials are made of atoms with a positive nucleus and negative electrons orbiting. Some atoms have a stronger pull on these electrons than others. When we bring the two materials into contact one may have a stronger pull on the electrons. When we separate them, electrons can stick to the material with a stronger pull. This results in a material with more electrons and results in static electricity. 
 
    </p> 
 
    </div> 
 
    </body>

Quelle

2017-04-11 06:44:56

Sie müssen jedes Element geben, ein id

<div id="box1"></div> 
<div id="box2"></div> 
<div id="box3"></div>

Ihre Css wird dann folgendermaßen aussehen

#box1{ 
    background-color:red; 
} 
#box2{ 
    background-color:blue; 
}

hoffen, dass es Ihnen hilfreich ist :)

Quelle

2017-04-11 06:42:16

Sie sind das Erstellen von benutzerdefinierten Farbmarkierung anstelle dieses Attributs Verwendung Stil in div-Tag.

<div class="boxed" style="background-color:green"> 
</div>

Quelle

2017-04-11 06:46:56 Karan

Wie ändere ich die Farbe einer Box div (HTML)

Antwort

Verwandte Themen