Bereiche mit mehreren Elementen |
|
Bereiche mit mehreren Elementen definieren |
|
Anzeigebeispiel: So sieht's aus
Sie können mehrere Absätze, bestehend aus ganz verschiedenen Elementen wie Text, Grafiken, Tabellen usw., in einen gemeinsamen Bereich einschließen. Diesen Bereich können Sie dann gemeinsam ausrichten.
<div align=center> <h1>Der Mond - eine Überschrift</h1> <img src="mond.jpg" align=middle> Ein Bild vom Mond <p>Ein erklärender Text zum Mond, und alles wird zentriert</p> </div> <div align=right> <i>© 1997 by Josua Piesepampel</i> </div> |
Mit <div> leiten Sie einen Bereich ein, in den Sie mehrere Elemente einschließen können (div = division = Bereich). Alles, was zwischen diesem Tag und dem abschließenden </div> steht, wird als Teil des Bereichs interpretiert.
Einen solchen Bereich und alle seine enthaltenen Elemente können Sie mit dem Attribut align= im einleitenden <div>-Tag ausrichten. Mit align=center richten Sie den Bereich mit allen seinen Elementen zentriert aus (align = Ausrichtung, center = zentriert), mit align=right rechtsbündig (right = rechts). Mit align=justify werden innere Elemente wie freistehender Text, Textabsätze oder Überschriften als Blocksatz ausgerichtet. Mit align=left erzwingen Sie die linksbündige Ausrichtung von Elementen (Voreinstellung).
Anzeigebeispiel: So sieht's aus
Sie können mehrere Absätze, bestehend aus ganz verschiedenen Elementen wie Text, Grafiken, Tabellen usw. gemeinsam zentriert ausrichten.
<center> <h1>Der Mond - eine Überschrift</h1> <img src="mond.jpg" align=middle> Ein Bild vom Mond <p>Ein erklärender Text zum Mond, und alles wird zentriert</p> </center> |
Mit dem Tag <center> wird alles, was folgt, zentriert ausgerichtet (center = zentriert). Das können Überschriften, Text, Grafiken oder Tabellen sein. Mit dem abschießenden Tag </center> beenden Sie die Zentrieranweisung.
Das <center>-Tag steht auf der Abschußliste des W3-Konsortiums, das heißt, es soll in Zukunft aus dem HTML-Standard entfernt werden. Benutzen Sie stattdessen den Befehl <div align=center>, der das gleiche leistet.
Das <div>-Tag und das <center>-Tag können Universalattribute enthalten.
Wenn Sie HTML bereits etwas besser kennen, probieren Sie auch mal die Möglichkeiten aus, die Ihnen CSS Style-Sheets bieten. Denn
gerade das sehr allgemeine <div>-Tag ist geradezu prädestiniert dafür, um mit Hilfe von Style-Sheets zum Leben erweckt zu werden. Dazu müssen Sie zunächst wissen, wie man Style-Sheets definieren kann. Anschließend sind Sie in der Lage, Style-Sheet-Angaben anzuwenden. Auf das <div>-Tag können Sie beispielsweise folgende Style-Sheet-Angaben anwenden:
Schriftformatierung
Abstände, Ränder, Ausrichtung
Rahmen und Innenabstände
Hintergrundfarben und -bilder
Elemente positionieren
Mehrspaltiger Textfluß
weiter: | Trennlinien |
zurück: | Schriftgröße, Schriftfarbe, Schriftart |