Gestalten mit Linien

Linienbreite

Ihr kennt die Möglichkeit, mit horizontalen Linien Eure Seiten optisch zu gliedern. Die Breite der Linien könnt Ihr variieren. Dazu macht Ihr innerhalb des "HR-tags" einfach eine width-Angabe in Prozenten. Wenn nicht anders angegeben, werden die Linien zentriert dargestellt.

<hr width=50%>
usw...






Linienausrichtung

Linien könnt Ihr auch links- oder rechtsbündig ausrichten, was aber nur Sinn macht, wenn sie mittels einer Width-Angabe kürzer als normalerweise angegeben werden.

<hr width=60% align=left>
Bild
<hr width=60% align=right>



Liniengestaltung

Linienstärke

Die Size-Angabe bestimmt die Stärke der Linie. In der Voreinstellung ist es 2.
<hr size=1>

eine dünnere Linie
<hr size=5>

eine dickere Linie
<hr size=20>

eine sehr dicke Linie

Nicht-Schattierung von Linien

Mit der Angabe
<hr noshade>
werden Linien eindimensional dargestellt. Das macht dann Sinn, wenn die Hintergrundfarbe des Users weiß ist.
Ebenso wie bei dreidimensionalen Linien, könnt Ihr auch bei nicht-schattierten Linien deren Stärke verändern.
<hr  noshade size=5>

oder
<hr  noshade size=20>



Farbige Linien

Der folgerichtig denkende Mensch wird jetzt sicherlich meinen, der Tag müßte lauten:
<hr color="#Hexadezimalzahl">

Das ist im Prinzip auch richtig, nur kann Netscape dies noch nicht darstellen. Aber mit diversen Tricks, die mir die netten Mitglieder aus dem Compuserve-Forum verraten haben, ist es dennoch möglich, farbige Trennlinien zu gestalten.

1. Tu so, als wäre die Linie Text und mach ganz viele Unterstriche, denn farbigen Text können schon viele Browser darstellen:
<center>
<font size=4 color="#Hexadezimalzahl">___so viele Unterstriche, wie Ihr wollt___</font>
</center>
___________________________________________________________________________________

2. Erstelle eine ganz kleine Grafik, z.B. 2 mal 2 Pixel groß , und strecke sie auf die gewünschte Länge:
<IMG ALIGN=center SRC=punkt.gif" HEIGHT=2 WIDTH=660>

3. Die dritte Möglichkeit entsteht durch eine Angabe innerhalb einer Tabelle. Leider ergibt dies aber keine feinen Linien:
<center>
<table width=70%><tr><td bgcolor="#Hexadezimalzahl" height=1><font size=1>Kaufmanns-und#160;</font></td></tr></table>
</center>
 

4. Ihr bindet anstatt eines HR-Tags einfach ein GIF ein, was Euch aber auch mehr Speicherplatz kostet: Das kann eine relativ einfache Linie sein...
<img src="bar1.gif" width=70%>


...aber auch eine etwas aufwendigere Grafik.