Webmaster-Crashkurs

HTML-TAG <div> und <span>

Es gibt in HTML 2 Elemente, die als logische Funktion nur Bereiche umschließen – der <div> und der <span>-HTML-TAG.

<div>-Bereich

Das div steht für das englisch „division“, was nichts anderes als Bereich meint. Es umfasst also einen Bereich. Wenn Sie z. B. in Ihrer Website einen Kopfbereich haben, in der der Firmenname steht und das Firmenlogo wäre das ein Bereich, der vom <div>-umschlossen sein könnte.

<div>
	<p>Firma XY Gmbh AG</p>
	<img src=“firmenlogo.jpg“ />
</div>

So haben Sie i.d.R. auf einer Homepage immer mehrere Bereiche wie z.B. bei der einfachen Art einen Kopfbereich, Steuerungsbereich, Inhaltsbereich und Fußbereich

typische Bereich für div

Das <div>-HTML-TAG ist ein Blockelement – es nutzt die komplette zur Verfügung stehende Breite.

Der <div>-HTML-TAG entfaltet seine volle Vielfalt erst unter CSS und ist dort unentbehrlich!

<span>-Bereich

Ähnlich ist es mit <span>-HTML-TAG. Auch dieser umschließt einen Bereich, allerdings innerhalb einer Zeile. Ein Beispiel verdeutlicht es am besten. Im folgenden Satz soll das Fazit umschlossen werden, damit es später eine andere Hintergrundfarbe bekommen kann:

<p>Das Fazit von XHTML und CSS ist <span>die Philosophie 
der Trennung von Inhalt und Design</span>, was der richtige Schritt 
in Richtung barrierefreier Websites darstellt. </p>

Das <span>-HTML-TAG ist ein Inline-Element – es kommt innerhalb von Zeilen vor.

Auch hier entfallt der <span>-HTML-TAG erst seine volle Tragweite beim Einsatz von CSS und ist dann nicht mehr weg zu denken.

HTML5-Video-Kurs:
hier klicken für
mehr Informationen
© 2008-2024   •   www.webmaster-crashkurs.de - HTML5 Tutorial mit Videos • Impressum • Datenschutzerklärung
weitere eigene Projekte: