{"id":88,"date":"2012-11-12T19:45:50","date_gmt":"2012-11-12T19:45:50","guid":{"rendered":"https:\/\/ai.hasebox.de\/index.php\/2012\/11\/12\/5-divs\/"},"modified":"2023-12-14T16:45:04","modified_gmt":"2023-12-14T16:45:04","slug":"5-divs","status":"publish","type":"post","link":"https:\/\/ai.hasebox.de\/index.php\/2012\/11\/12\/5-divs\/","title":{"rendered":"5. divs"},"content":{"rendered":"

Divs werden verwendet um Abschnitte zu markieren. Alle Elemente, die in ein <div> eingebettet sind geh\u00f6ren zur gleichen Gruppe.  
Divs sollen dir helfen, deiner Seite mehr Struktur zu geben. Deutlich wirds hoffentlich an dem folgenden Beispiel:<\/p>\n

Erstelle die Datei \/ai\/css\/divs\/design.css und kopiere den folgenden Code.<\/p>\n

#kastenrot { background-color: red;
             width:200px;
}
#kastengruen { background-color: green; 
               width:400px;
}<\/code><\/p>\n

Anschlie\u00dfend erstellst du die Datei ai\/css\/divs\/divs.html und kopierst folgenden Code. <\/p>\n

<html><\/p>\n

<head>
<link href=\"design.css\" type=\"text\/css\" rel=\"stylesheet\" \/>
<\/head><\/p>\n

<body>
<h1>jetzt HTML lernen mit CSS<\/h1><\/p>\n

<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><\/p>\n

<div id=\"kastengruen\">
<p> Ich bin auch ein Text, geh\u00f6re aber einem anderen Div an, der Gruppe kastengruen. <\/p>
<\/div><\/p>\n

<\/body><\/p>\n

<\/html><\/code><\/p>\n

Aufgabe:<\/h5>\n

Erstelle eine weitere Gruppe mit den Eigenschaften blau, Schriftfarbe weiss, breite 600 Pixel.<\/p>\n

ABGABE: Beide Dateien sollten sich in dem Ordner ..\/divs befinden. Wie \u00fcblich wird dieser Ordner gezippt und \u00fcber Iserv – Aufgabe 5 divs – abgegeben.<\/p>\n","protected":false},"excerpt":{"rendered":"

Divs werden verwendet um Abschnitte zu markieren. Alle Elemente, die in ein <div> eingebettet sind geh\u00f6ren 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; […]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","footnotes":""},"categories":[50],"tags":[],"class_list":["post-88","post","type-post","status-publish","format-standard","hentry","category-css"],"_links":{"self":[{"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/posts\/88","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/comments?post=88"}],"version-history":[{"count":1,"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/posts\/88\/revisions"}],"predecessor-version":[{"id":405,"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/posts\/88\/revisions\/405"}],"wp:attachment":[{"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/media?parent=88"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/categories?post=88"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ai.hasebox.de\/index.php\/wp-json\/wp\/v2\/tags?post=88"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}