CSS und HTML

Status
Es sind keine weiteren Antworten möglich.

cLypse

Lt. Junior Grade
Dabei seit
Jan. 2005
Beiträge
260
Hallo,

Also ich soll für die Schule was mit CSS machen.
Und zwar 3 Kästen, wo ich auch ein Bild gemacht habe wie es ca. sein soll.
Diese Kästen sollen mit CSS gemacht werden, bzw es soll soviel wie möglich mit CSS gemacht werden.
Ich hab mich jetzt erkundigt und "gelernt" und auch verstanden wie man die farbe ändert und so aber nicht wie man solche Kästen macht.

So soll es ca aussehen:
http://home.arcor.de/frankyyyy/Beispiel.JPG

Danke schonmal
 

SLH3

Ensign
Dabei seit
Mai 2005
Beiträge
243
Du kannst diese Sachen mit <Div>'s machen: Div können eine fixe Position, Grösse, usw. zugeordnet werden. Einfach alles.

Am besten schaust du unter http://de.selfhtml.org und dort nach <div> suche...
 

ZeroFlash

Lt. Junior Grade
Dabei seit
Jan. 2002
Beiträge
382
hatte grad mal lange weile

HTML:
<html>
<head>
<style>
body {
	margin:0px;
	}
.container {
	width:450px;
	height:auto;
	text-align:center;
	}
.rot {
	margin:auto opx;
                width:400px;
	height:80px;
	background:red;
	margin-bottom:20px;
	text-align:left;
	}
.blau {	
	width:50px;
	height:200px;
	background:blue;
	float:left;
	}
.gruen {
	width:300px;
	height:200px;
	background:lightgreen;
	float:right;
	}
</style>
</head>
<body>
<div class="container">
	<div class="rot"></div>
	<div class="blau"></div>
	<div class="gruen"></div>
</div>
</body>
</html>
am besten du probierst erstmal im quellcode rum und guckst dich auf http://www.css4you.de mal um, dann solltest du es auch lernen und verstehen können.

btw. das centern ist nur für den ie und mit margin:auto 0px ist eigentlich die richtige variante nur das macht der ie nicht. weiß aber nicht ob die reihenfolge jetzt stimmt. hab hier nur den ie zum testen :( also musst dann evtl auto und 0 px vertauschen in der reihenfolge ;)
 

Benjamin_L

Commander
Dabei seit
Dez. 2004
Beiträge
2.505

cLypse

Lt. Junior Grade
Ersteller dieses Themas
Dabei seit
Jan. 2005
Beiträge
260
acvhso korrekt danke, jetzt hab ich nur eine frage, ich muss in dem hauptkasten, also den grössten eine html tabelle reinbauen. Wo muss ich die dan hinschreiben?
 

ghorst

Lieutenant
Dabei seit
Mai 2005
Beiträge
643
zwischen <div class=...> und </div> setzt du einfach deinen html code.
also <div class=...> <table ...>....</table> </div>
 

ZeroFlash

Lt. Junior Grade
Dabei seit
Jan. 2002
Beiträge
382
ich hoffe nur du musst die tabelle nicht für die contentgestaltung nehmen?
dafür gibts schlicht css...

ja das mit doctype ist zwar richtig das man es in das html doc mit reinschreiben muss damit die seite validiert werden kann, aber zum rumprobieren braucht man es nicht.

das mit margin auf auto versteht der ie leider nicht. kannst es probieren.... habs bisher nicht hinbekommen. dafür gibts dann ja den workaround... kannst es natürlich auch mit 50% left und margin-left:-halbe containerbreite machen, aber dann schiebst du dir den content beim fenster verkleinern einfah über den browserrand hinweg und futsch ist alles, was ja auch irgendwie logisch ist
 

mh1001

Lt. Commander
Dabei seit
Nov. 2003
Beiträge
2.039
@ZeroFlash

Gerade beim "Herumprobieren" sollte man auch immer einen Doctype festlegen. ;)
Ansonsten kann es passieren, das einige Dinge im Quirks-Modus der Browser nicht klappen oder vollkommen anders dargestellt werden. ;)
Darunter fällt beim Internet-Explorer unter anderem auch das besagte "margin: 0px auto;".

MfG mh1001
 

cLypse

Lt. Junior Grade
Ersteller dieses Themas
Dabei seit
Jan. 2005
Beiträge
260
Also ich soll in der grössten Box eine Tabelle machen.
Wie soll ich das denn am besten machen? Nicht mit schlichten Html Code?
 

ZeroFlash

Lt. Junior Grade
Dabei seit
Jan. 2002
Beiträge
382
@ mh1001: ja, aber es ging selbst mit doctype nicht mit margin.... kann ja sein das ich mich immer wieder vertippe aber es ging nicht.... :rolleyes:

@ cLypse: womit willst du die tabelle denn sonst machen? du kannst auch tabellen mit css formatieren..., musst dir halt erstmal überlegen wie sie aussehen sollzb. breite, höhe, spaltenbreiten,spaltenhöhe etc. du kannst die tabelle dann einfach in den "gruen" container reinmachen. du solltest allerdings nur tabellenartigen inhalt in einer tabelle darstellen und nicht versuchen zb die seite mit tabellen aufzubauen...

das ist veraltet und für seitenaufbau gibt es css :)
 
Status
Es sind keine weiteren Antworten möglich.
Top