Durch Trennlinien kannst Du Texte trennen. Anhand dieser Trennlinie wird das Prinzip von Attributen erklärt. Diese Attribute benötigst Du bei allen möglichen TAGs.
Trennlinien
Trennlinien <hr> sind an und für nichts Besonderes. Sie trennen zwei Abschnitte. Das <hr> steht für engl. horizontal ruler = horizontale Linie.
<html>Text eins
<head>
</head>
<body>
Text eins <hr> Text zwei
</body>
</html>
Text zwei
Attribute
Attribute beschreiben für alle TAGs deren Eigenschaften. Wird kein Attribut aufgeführt, wird das Standard-Attribut angenommen, z. B. dass etwas links ausgerichtet ist. Zu Attributen gehören meistens noch Werte.
Beispiel
TAG |
Attribute |
Werte |
<body |
align= |
"left"> |
Größe eines Elementes
Attribute gehören zu zahlreiche TAGs, z. B. kann eine Trennlinie folgende Attribute haben:
TAG |
Attribute |
Werte |
Erläuterungen |
<hr |
align= |
"left"> |
Mit align="left" erreichst Du, dass die Trennlinie linksbündig ausgerichtet wird (align = Ausrichtung, left = links). Mit align="right" wird die Trennlinie rechtsbündig ausgerichtet (right = rechts) und mit align="center" zentriert (Voreinstellung). Das Ausrichten von Trennlinien ist allerdings nur in Verbindung mit dem Attribut width= sinnvoll, da die Trennlinie ansonsten stets über die gesamte verfügbare Breite geht. |
noshade |
der Browser zeigt die Trennlinie massiv und durchgezogen an, also nicht-schattiert an(noshade = unschattiert). | ||
size= |
"1"> |
Durch das Attribut size= (size = Größe) kannst Du die Höhe (Dicke) der Trennlinie bestimmen. Die Voreinstellung beträgt 2 Punkt. Mit dem Wert 1 erzwingst Du also eine besonders dünne Trennlinie, mit Werten über 2 kannst Du dickere als die normalen Trennlinien erzeugen. | |
width= |
"500"> |
der Browser zeigt die Trennlinie so breit wie angegeben. Du kannst eine Zahl oder einen Prozentwert angeben. Mit einer Zahl, z.B. 300, erzwingst Du, dass die Trennline so viel Pixel breit dargestellt wird wie angegeben. Mit einem Prozentwert erreichst Du, dass die Trennlinie maximal so viel Breite des Anzeigefensters einnimmt wie angegeben. Für eine prozentuale Angabe notierst Du hinter der Zahl einfach ein Prozentzeichen (%). |
Bei dem Tag <hr> sieht das dann so aus
<html>
<head>
</head>
<body>
Text eins <hr size="5" > Text zwei
</body>
</html>
Anmerkung:
Die Attribute wiederholen sich bei verschiedenen TAGs - allerdings sind nicht alle Attribute bei allen TAGs erlaubt.
Text einsText zwei
Aufbau Attribute
Attribute setzt sich also aus 2 Teilen zusammen. Im ersten, z.B. "size", wird die Art der Beeinflussung festgelegt und im zweiten dann die Ausprägung, hier 20.
Ausrichtung - rechts, links, mitte
Elemente können ausgerichtet werden. Dazu dient das Attribut "align" (engl.: ausrichten). Dabei sind folgende Möglichkeiten vorhanden
- align="left"
- align="center"
- align="right"
<html>
<head>
</head>
<body>
Eine Wurm wanderte auf der Welt entlang ...
<hr size="1" noshade width="55" align="left">
<hr width="55" align="center">
<hr width="55" align="right">
</body>
</html>
Das Attribut width="55" wird im nächsten Punkt erklärt. Benutze es einfach mal.
Breite eines Elementes
Ein weiteres Attribut ist die Breite width (engl. Breite/Weite). Im folgenden Beispiel siehst Du die Trennlinie mit einer Breite von 55.
Text einsText zwei
Prozentuale Werte
Im nächsten Beispiel ist die Linie 55% breit abhängig vom Browserfenster. Probiere das Beispiel aus und ändere dann die Fenstergröße des Browser. Die Linie wird automatisch sofort kleiner bzw. größer.
<html>Text eins
<head>
</head>
<body>
Text eins <hr width="55%" > Text zwei
</body>
</html>
Text zwei
Tipp:
Es ist unnötig Attribute mit Standardwerten zu setzen, z. B. bei <hr align="center"> oder bei Schrift eine Ausrichtung links. Denn ohne die Angabe wäre die Anzeige die gleiche.