Hallo
Habe es mit dieser Variante ausprobiert. Komme damit aber nicht ganz zurecht. Anscheinend verlangt diese Form wieder andere Gestaltungsregeln. Ich habe folgenden code geschrieben:
<!doctype html> <html lang="de"> <head> <meta charset="utf-8" /> <title></title> <style> html { background-color: red; } body { background-color: blue; width:250px; outline: 2px solid; } p { display: block; background-color: yellow;; } </style> </head> <body> <div> <main role="main"> <p>Ein Übungstext Ein Übungstext Ein Übungstext</p> </main> </div> <div> <table border="" frame=""> <td>Inhalt</td> <td>Inhalt</td> </table> </div> </body> </html>
Wen ich entweder html oder body eine Hintergrundfarbe gebe, ändert sich überhaupt nichts.
Die jeweilig gesetzte Hintergrundfarbe, genauer die des „vorderen“ Elements, sollte zu sehen sein.
Sobald ich in beiden eine unterschiedliche Farbe setze wird der Absatz "p" in der Farbe dargestellt als bekäme p einen Hintergrund; in Wirklichkeit ist es der body. Setze ich für p eine dritte Farbe so sieht man diese Farbe und die des body verschwindet. Sind body und p nun gleich groß oder wie?
Sofern kein weiteres Element, das für sich Platz einnimmt, vorhanden ist, ja. Du gibst für body
eine Breite vor. Die Höhe von body
richtet sich, ohne weitere Vorgaben, nach seinem Inhalt. Dieser wird offensichtlich von p
bestimmt. Wird die Tabelle überhaupt ausgegeben?
Eine weitere Besonderheit fällt mir auf, daß folgende HTML-Elemente alle im body verbleiben. Wahrscheinlich eine Gewöhnungssache. Eine Darstellung wie üblich bekomme ich nicht. Da habe ich zwar auch body als Container, aber ich kann darin unterschiedliche Bereiche gestalten bzw. divs setzen. Im Beispiel aber habe ich alles im body, also in einem einzigen Container zusammengefaßt, abgesehen von html; es verschiebt sich alles nur um eine Ebene noch oben.
Soweit, so richtig.
Beispielsweise hat hier für p "margin-top" überhaupt keine Wirkung außer man setzt für p float: left.
Das hat zu funktionieren. Wenn es nicht funktioniert, ist da noch eine andere Angabe, die dieser margin
-Regel widerspricht.
Also was macht das für einen Unterschied ob ich schreibe:
…
Ich erspare mir lediglich div im Anfan- und Endtag.
Ja, das ist erstmal alles. Es geht auch nicht darum, alle Elemente zwangsweise direkt in body
zu notieren, sondern unnötige Elemente zu vermeiden. Wenn dein div
ausschließlich dazu dienen soll, die weiteren Elemente direkt innerhalb des Elements body
zu gruppieren, kannst du es auch weglassen und sie stattdessen mit body
selbst gruppieren. Erfüllt das div
noch andere Zwecke, ist es sinnvoll, es dennoch zu notieren.
Jedenfalls kommt mir vor, daß html- bzw. CSS-Elemente anders zu handhaben sind.
Das ist nicht zutreffend. Was allerdings zu wissen wichtig ist, ist, dass body
je nach browser andere Standardvorgaben für margin
und padding
hat. Im Firefox z.B. hat body
einen margin
von ca. 25px.
Tschö, Auge
Es schimmerte ein Licht am Ende des Tunnels und es stammte von einem Flammenwerfer.
Terry Pratchett, „Gevatter Tod“