Informatik :: CSS :: Rahmen
In HTML besteht die Möglichkeit, ein Dokument mit Hlife von Linien
zu gliedern und Grafik mit einem Rahmen zu versehen. In CSS ist der Einsatz
von Rahmen und Linien an allen Ecken und Enden von Textelementen möglich.
Zum Definieren eines Rahmens verwenden Sie das Attribut border
zusammen mit der Bezeichnung der zu benutzenden Seite, also top,
left,
bottom oder right. Zusätzlich ist noch die Angabe der
Rahmenstärke mit with und einem numerischen Wert notwendig.
Außerdem ist noch die Angabe des Rahmenstils mit border-style
erforderlich.
|
Beschreibung |
---|---|
dashed | gestrichelt |
dotted | gepunktet |
double | doppelt durchgezogen |
groove | 3D |
inset | 3D |
none | ohne |
outset | 3D |
ridge | 3D |
solid | durchgezogen |
Beispiel:
<h2 style="border-bottom-with:3mm; border-style:double">Beispiel 1</h2>
Um einen Rahmen um das gesamte Element zu zeichnen, verwenden Sie das Attribut border ohne die Angabe einer darzustellenden Seite zusammen mit der Erweiterung with.
Beispiel:
<p style="border-with:2mm; border-style:dashed">Beispiel 2</p>
Bei dreidimensionalen Rahmen ist zudem die Angabe einer Farbe (außer schwarz) notwendig.
Beispiel:
<p style="border-with:3mm; border-style:groove; border-color:fuchsia">Beispiel 3</p>
Um den Text innerhalb des Rahmens mit einem Abstand zu versehen, können Sie das Attribut padding mit einem numerischen Wert anwenden.
Beispiel:
<p style="border-with:3mm; border-style:inset; border-color:blue;padding:5mm">Beispiel 4</p>
Die Beispiele haben dann folgendes Aussehen.