HTML Tutorial

[ Inhaltsverzeichnis ]
[ 1.1 ] [ 1.2 ] [ 1.3 ] [ 1.4 ] [ 1.5 ] [ 1.6 ] [ 1.7 ] [ 2.0 ] [ 2.1] [ 2.2 ] [ 2.3 ] [ 2.4 ] [ 2.5 ] [ 2.6 ] [ 2.7 ] [ 2.8 ] ] [ 2.9 ] [ 3.0 ] [ 3.1 ] [ 3.2 ] [ 3.3 ]

Textabsätze und Textbereiche formatieren

Durch den Einsatz von div, p, span besteht die Möglichkeit, Textpassagen rechts, links oder zentriert zu positionieren. Desweiteren bietet das span Tag den Einsatz von CSS (CascadingStyleSheets) innerhalb des HTML Quellcodes. Mit br und hr können Zeilenumbrüche erzwungen werden.

HTML Quellcode:

<html>
<head>
<title>Mustermanns Blumenladen</title>
<style type="text/css">
<!--
body { background-color:#33EE00; color:#002000; font-family:Times; }
.zentriert { text-align:center; }
.hervorgehoben { font-family:Arial; font-size:200%; color:navy; }
-->
</style>
</head>
<body>
<div class="zentriert">Unsere Blumentips</div>

<div style="text-align:right;">Dieser Blumentip ist rechts ausgerichtet</div>

<div style="font-family:arial; font-size:14pt">
Dieses ist ein mit span formatierter Blumentip, in dem
<span style="background-color:red">Text</span> hervorgehoben ist.
</div>
<hr/>
Zeilenumbrüche kann man auch durch <br/> (break)
oder <hr/> (horizontal line break) erreichen.
</body>
</html>

Und so sieht's im Browser aus...

Erklärung:


Mit den gezeigten Möglichkeiten können Sie Textabsätze und Textbereiche gestalten und ausrichten.
  • Die Elemente div und p funktionieren sehr ähnlich, jedoch mit einem Unterschied: Bei mit p formatierten Absätzen wird über und unter dem Absatz eine Leerzeile eingefügt. Dieses Einfügen entfällt beim Einsatz des div-Elements.
  • Mit span können beliebige Textbereiche formatiert werden.
  • Mit <br/> (line break) wird ein einfacher Zeilenumbruch bewirkt.
  • Mit <hr/> (horizontal line break) wird ein einfacher Zeilenumbruch mit einer horizontalen Trennlinie über die gesamte Textbreite bewirkt.

[ Inhaltsverzeichnis ]
[ 1.1 ] [ 1.2 ] [ 1.3 ] [ 1.4 ] [ 1.5 ] [ 1.6 ] [ 1.7 ] [ 2.0 ] [ 2.1] [ 2.2 ] [ 2.3 ] [ 2.4 ] [ 2.5 ] [ 2.6 ] [ 2.7 ] [ 2.8 ] ] [ 2.9 ] [ 3.0 ] [ 3.1 ] [ 3.2 ] [ 3.3 ]


©2003 de Vries