 Unterschied zwischen DIV und SPAN: DIV ist ein Block-Element. Ein DIV nimmt die komplette Breite ein, sofern nichts anderes in CSS umdefiniert wurde. Ein DIV nimmt die komplette Breite ein, sofern nichts anderes in CSS umdefiniert wurde. SPAN ist ein Inline-Element. Es kann innerhalb eines Bereiches angewendet werden. Die zwei Befehle werden erst durch CSS extrem nützlich. Beide Elemente werden primär zum Begrenzen von Bereichen genutzt. Über die Attribute der Elemente, kann dann Design in die umschlossenen Bereiche gebracht werden. Dabei können die Elemente geschachtelt werden. Ein -Element innerhalb eines übergeordneten ? Diese Frage wird häufig gestellt. Die einfache Antwort: Ja, es ist ohne Weiteres möglich und auch valide, -Elemente beliebig zu verschachteln. Allerdings muss auf Folgendes geachtet werden: • Der -Tag darf als Inline-Element, welches für die CSS-Formatierung von Text und anderen Inhalten gedacht ist, nur weitere Inline-Elemente, wie etwa <span>, <strong>, <em>, <img>, <a>, <br> etc. enthalten. • Block-Elemente wie <div,>, <p>, <table>, <form>, <blockquote>, <h1> etc. sind hingegen nicht erlaubt. |
| div - Division/Abschnitt | |||
| Befehl | Beschreibung | Wert | Beispiel |
| <div> |
DIV ist ein Block-Element. Ein DIV nimmt die komplette Breite ein, sofern nichts anderes in CSS umdefiniert wurde.
|
<div style="background-color: red;">Irgendwas</div> <div id="div" style="left: 15%;top: 2.2em; position:absolute;height: 1.8em; width: 22em" class="auto-style2"> | |
| <div> Verschachtelung | Über DIV wird ein Bereich definiert. Diesen Bereich kann man über CSS dann ein Design „überstülpen“. Angesprochen wird der Bereich über seinen ID-Namen. Bei DIV handelt es sich um ein Blockelement - das Blockelement nutzt die komplette Bildschirmbreite. | <div id="xyz">
<div class="nr1"> <div class="bild1"></div> <div class="busch"<p>Hans Busch</div> </div> </div> | |
| Über DIV wird ein Bereich definiert. Diesen Bereich kann man über CSS dann ein Design „überstülpen“. Angesprochen wird der Bereich über seinen ID-Namen. Bei DIV handelt es sich um ein Blockelement - das Blockelement nutzt die komplette Bildschirmbreite. | <div id="NAME">BEREICH</div> | ||
| Der DIV-Bereich kann per CSS über seinen Klassen-Namen angesprochen werden. | <div class="NAME">XYZ</div> | ||
Areas | |
| Tags | Beschreibung |
|
<header> ... </header> |
Bereich für Kopf (nicht verwechseln mit <head>!) |
|
<nav> ... </nav> |
Bereich Navigation (Steuerung) |
|
<section> ... </section> |
Gruppiert Elemente |
|
<article> ... </article> |
Bereich für Inhalt |
|
<aside> ... </aside> |
Bereich für Zusatzinformationen zum Inhalt |
|
<footer> ... </footer> |
Bereich für Fuß |
|
<div id="NAME">BEREICH</div> |
Über DIV wird ein Bereich definiert. Diesen Bereich kann man
über CSS dann ein Design „überstülpen“. Angesprochen wird der Bereich über seinen ID-Namen. Bei DIV handelt es sich um ein
Blockelement - das Blockelement nutzt die komplette Bildschirmbreite. |
|
<div class="NAME">XYZ</div> |
Der DIV-Bereich kann per CSS über seinen Klassen-Namen angesprochen werden. |
|
<span id="NAME">XYZ</span> |
Mit SPAN können Textstellen markiert werden und diese dann über CSS mit Design versehen werden. Das SPAN-Element ist ein
Inline-Element, was den Unterschied zum DIV-Element ausmacht. |
|
<span class="NAME">XYZ</span> |
Kann über den Klassennamen und CSS mit Design versehen werden. |
Kontakt Datenschutz Impressum |