oke schau es ist geundsätzlich ganz einfach ein jedes Html besteht ja aus folgenden elementen
// Html – Ist im prinzip ein leeres Blatt Papier
// Head – Dort ist alles geschriebe was nicht auf anhieb sichtbar ist (styles; title; metas; usw)
// Body – Dort ist alles gschrieben was sofort sichtbar ist
// Doctype – gehört eigentlich an den anfang aber dir das Doctype hier zu erklären ist zu umständlich
so nun ist es einfach da wir ohne tabelle arbeiten kommt css zum einsatz, das stylesheet enthält alle angaben welche nicht in Html geschrieben werden.
Um das zu verdeutlichen sag ich es mal so:
// Das CSS hat die aufgabe jegliche art von,
/é Farben
/é Höhen und Breiten angaben
/é Positionen der Elemente
/é Text und Listen auszeichnungen
/é ebenfalls dazu gehört das auszeichnen von Tabellen welche wiederum das gleiche beinhalten wie das oben erwähnte
//é du kannst tags direkt auszeichnen
//é du kannst klassen bestimmen alle klassen haben einen . vor dem jeweiligen namen der klasse, eine klasse kann jeden beliebigen Namen haben den du ihm geben willst er sollte allerdings nicht zu lang sein
//é du kannst id’s bestimmen alle id’s haben ein # zeichen vor dem jeweiligen namen der id, jede id kann jeden beliebigen Namen haben den du ihr geben willst er sollte allerdings nicht zu lang sein
um zu deinem beispiel zurück zukehren hier ohne Doctype dargestellt
.HTML
[HTML]
der Titel deiner HP
/* mit dem stern kannst du einen glabal reset machen da jeder Browser eine eigenes Stylesheet besitzt welches immer dann zum eisatz kommt wo keine angabe gamacht wurde hier werden nur aussen und innen abstände auf 0 gesetzt*/
/* so nun zum eigentlichen stylesheet /
/ mit margin: 0 auto; geschieht folgendes das 0 ist der margin-top und der margin-bottom, auto ist der margin-left und margin-right */
#wrapper {
width: 70%;
height: auto;
margin: 0 auto;
}
/* die folgenden höhen und breiten angaben beziehen sich nun jeweils auf das wrapper element da wir alle folgenden container in den wrapper hineinpacken */
#head {
width: 100%;
height: 20%;
}
#menu {
width: 25%;
height: auto;
float: left;
}
#textContent {
width: 75%;
height: auto;
float: right;
}
#footer {
width: 100%;
height: auto;
clear: both;
}
/* clear löst das float auf da sonst alles nachgehende ebenfalls gefloatet wird */
<div id="head"></div>
<div id="menu"></div>
<div id="textContent"></div>
<div id="footer"></div>
[/HTML]
so wenns dir bis hierhin nicht genau klar ist was du machst dann sollten
CSS 4 You - The Finest in Stylesheets
und
intensivstation
dir weiterhelfen können.
Wenn danach der 5er immer noch nicht gefallen ist dann rate ich dir entweder die jobbörse zu nutzen oder aber dir bücher zu kaufen welche dir html und css vermitteln ohne dass andere dir gleich den kompletten code vorkauen müssen.
mfg devilseye