HTML-Grundlagen: align und CSS: text-align

Align: veraltete Positionierung in HTML

Die Möglichkeiten, Text zu formatieren, fett zu schreiben, kursiv anzuzeigen, ist zwar wichtig und notwendig, aber ebenso wichtig ist die richtige Anordnung des Textes und dazu braucht es die Positionierung. Das gilt nicht nur für Text alleine, auch eine Animationen oder Bilder wollen richtig positioniert sein.

Lange Zeit hatte man das in HTML mit dem Zusatzparameter align durchgeführt. Dieser ist aber heute nicht mehr gefragt und wird vom W3C-Konsortium schlichtweg abgelehnt. Stattdessen ist CSS zum Einsatz gekommen. Technisch funktioniert die Angabe von Align aber weiterhin, um etwa die Art und Weise festzulegen, wie Text und Bild zusammenspielen soll.

Positionierung mit der HTML-Angabe Align

ergibt:

Das ist ein linksbündiger Satz.

Jetzt bin ich zentriert.

Nun bin ich rechtsbündig.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,

Wieder linksbündig, aber mit CSS-Befehl.

CSS kann es eleganter und einfacher, Align funktioniert aber noch immer

An sich sollte align kein Thema mehr sein, aber man trifft den Befehl immer noch sehr oft im Internet an. Um ein Verständnis dafür zu haben, was dieser Parameter kann, habe ich das Beispiel eingebaut. Oftmals wird align auch noch sinnlos integriert.

Die erste Zeile ist zum Beispiel mit einem sinnlosen align ausgestattet. "align=left" bedeutet, dass der nun folgende Absatz linksbündig dargestellt werden soll. Da Text standardmäßig sowieso linksbündig ist und es sich hier um den ersten Absatz handelt, ist die Angabe sinnlos. Sie werden in vielen Tabellen und Absätzen auf verschiedensten Webseiten Situationen erleben, wo ohnehin linksbündiger Text auch noch mit align=left definiert ist. Die Angabe ist hingegen nötig, wenn davor eine andere Positionierung gewählt wurde.

Die zweite Zeile zeigt Text in zentrierter Form, die dritte Zeile in rechtsbündiger Form. Eine Sonderstellung nimmt der Blocksatz ein, der das vierte Beispiel zum Inhalt hat. Und nach dem Blocksatz wurde im letzten Beispiel auf linksbündig umgeändert, aber nicht mehr mit dem veralteten align, sondern mit dem CSS-Befehl text-align.

Mit diesem Befehl kann man die gleichen Einstellungen vornehmen, wie sie mit align gezeigt wurden. Der Unterschied ist nur, dass man mehr als nur die Richtung vorgeben kann und Pixelgenau die Abstände nach oben, unten, links und rechts definieren kann. Da man über eine externe CSS-Datei übergreifend handeln kann, sind so diverse Absätze auf diversen Seiten schnell formatiert, ohne dass man jede Seite individuell verändern muss.

Lesen Sie auch

Die Positionierung auf der Webseite ist eines der Themen, die am stärksten verändert wurden. Statt der Layouttabelle wird mit Ebenen, den div-Tags gearbeiten, die Framesets gibt es nicht mehr und auch die align-Befehle werden zwar noch verwendet, sind aber durch CSS praktisch abgelöst worden.

Mit dem align-Zusatz horizontal und valign vertikal hat man lange Jahre die Texte an Bilder ausgerichtet und umgekehrt, mit CSS-Definitionen lässt sich das aber längst leichter bewerkstelligen.

Ein anderes Thema ist die Ebene mit dem div-Tag, die auch für die responsive Darstellung für Handys und andere Geräte zuständig ist. In Kombination mit CSS gelingen so sehr übersichtliche Seiten, die sich auch anpassen können. Ebenfalls oft im Einsatz ist ein besonders Element auf der Seite und zwar der IFrame als Platzhalter für externen Inhalt wie etwa Börsennachrichten.

Diesen Artikel teilen

Kategorien

Grundlagen
HTML-Grundlagen
CSS-Grundlagen
Javascript-Grundlagen
PHP-Grundlagen
MySQL-Grundlagen
SEO-Grundlagen

Infos, Tipps, Vermarktung
Webdesign-Lexikon
Online-Werbung
PHP-Codeschnipsel