• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Wie kann ich eine einzelne Box eine bestimmte farbe zuordnen

K

Kevin Pfann

Neues Mitglied
Hi

versuche mich gerade im css mein code schaut so aus:

<style type="text/css">

body {
margin-top: 100px;background-color: FF00FF;
margin-right: 40px;background-color: FFFFDF:
margin-bottom: 10px;background-color: FFFFFF;
margin-left: 70px;background-color: 000000;
}

</style>
-------------------------------------------------

Leider funktioniert dieser nicht und ich kann mir nicht erklären warum....
Will das jede einzelne Box eine ander Farbe hat...

Bitte, Hilfe !!!!:cry:
 
In deinem CSS-Code hast Du alle Eigenschaften dem Body zugewiesen und zudem die Farben falsch definiert.

Wenn Du Boxen per CSS stylen willst, musst Du diese auch so ansprechen. Beispiel:

HTML
Code: 
<div id="box1">Das ist eine Box</div>

CSS
Code: 
div#box1 { margin-top:  100px;background-color: #FF00FF; }

Mit dem body hat dein Wunsch imho nichts zu tun.
 
<HTML>

<div id="box1">Das ist die erste Box</div>
<div id="box2">Das ist die zweite Box</div>
<div id="box3">Das ist die dritte Box</div>
<div id="box4">Das ist die vierte Box</div>

<style type="text/css">

div#box1 { margin-top: 100px;background-color: #FF00FF; }
div#box2 { margin-right: 40px;background-color: #FFFFDF; }
div#box3 { margin-bottom: 10px;background-color: #FFFFFF; }
div#box4 { margin-left: 70px;background-color: #000000; }


</style>
<BODY>
</BODY>
</HTML>
-----------------------------------------

Is das so richtig gemeint ? Geht leider nur die erste und letzte Box...
 
Kevin Pfann schrieb:
Wollte das eigentlich so machen wie bei dieser Seite: Webmaster Tutorials zum Homepage erstellen: Marketing, Webdesign, Existenzgr

Kann mir irgendjemand Tipps geben wie ich so was mache ? Is ja ned die kleinste Seite...
Zum Vergrößern anklicken....


Solche Seiten sollte man sich vom Quelltext her nicht als Vorbild nehmen, wenn sie semantische und syntaktische Fehler haben, [Invalid] Markup Validation of http://www.perfekte-website.de/ - W3C Markup Validator

Wenn dir aber nur das Design nachahmen willst spricht nichts dagegen.


Seite erstellt man in dem man zuerst seinen Inhalt richtig auszeichnet (falls du dazu fragen hast stelle sie gerne ins HTML Forum), dann sieht dies Seite zwar kot aus, aber diese schlecht aussehende einfach, zu wartende, semantisch richtige Seite möbelt man dann mit CSS auf.

Wenn du dann bei CSS noch darauf achtest nicht immer fixe Längenangaben und fixe Positionierungen zu nutzen und die Seite dann daher nur auf deinem Bildschirm gut aussieht, sondern viel relative und static nutzt, damit die Seite überall gut aussieht, dann steht nichts mehr im Wege.

http://jendryschik.de/wsdev/einfuehrung



MfG
 
einfach mel den code geben.

oke schau so sollte es aussehen
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ice="http://ns.adobe.com/incontextediting">
<head>
<meta http-equiv="Content-Type" content="text/html; charset="utf-8">
<title>dein Titel</title>
<style type="text/css" />
div#box1 { margin-top:  100px;background-color: #FF00FF; }
div#box2 { margin-right:  40px;background-color: #FFFFDF; }
div#box3 { margin-bottom:  10px;background-color: #FFFFFF; }
div#box4 { margin-left:  70px;background-color: #000000; }
</style>
</head>
<body>

<div id="box1">Das ist die erste Box</div>
<div id="box2">Das ist die zweite Box</div>
<div id="box3">Das ist die dritte Box</div>
<div id="box4">Das ist die vierte Box</div>

</body>
</html>
so damit tuts richtig.
ich würde allerdings die boxen nicht mit 1,2,3,4 usw benennen sondern mit den aufgaben die sie erfüllen sollen, sprich div#header, div#navigation oder nav, div#main, div#footer,
usw.
somit kannst du auch die positionierung der divs vornehmen, header wäre dann der banner resp. kopfteil deiner page.

MFG devilseye
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben