Divs werden verwendet um Abschnitte zu markieren. Alle Elemente, die in ein <div> eingebettet sind gehören zur gleichen Gruppe.
Divs sollen dir helfen, deiner Seite mehr Struktur zu geben. Deutlich wirds hoffentlich an dem folgenden Beispiel:
Erstelle die Datei /ai/css/divs/design.css und kopiere den folgenden Code.
#kastenrot { background-color: red;
width:200px;
}
#kastengruen { background-color: green;
width:400px;
}
Anschließend erstellst du die Datei ai/css/divs/divs.html und kopierst folgenden Code.
<html>
<head>
<link href="design.css" type="text/css" rel="stylesheet" />
</head>
<body>
<h1>jetzt HTML lernen mit CSS</h1>
<div id="kastenrot">
<p> Ich bin Text. Alles was in diesem Div steht gehoert zur Gruppe kastenrot und bekommt
die Eigenschaften, die in der CSS-Datei angegeben wurden.</p>
</div>
<div id="kastengruen">
<p> Ich bin auch ein Text, gehöre aber einem anderen Div an, der Gruppe kastengruen. </p>
</div>
</body>
</html>
Aufgabe:
Erstelle eine weitere Gruppe mit den Eigenschaften blau, Schriftfarbe weiss, breite 600 Pixel.
ABGABE: Beide Dateien sollten sich in dem Ordner ../divs befinden. Wie üblich wird dieser Ordner gezippt und über Iserv – Aufgabe 5 divs – abgegeben.
Schreibe einen Kommentar