Stil mit {stil}

Jan 2009

Border • Eigenschaft border-width für den sichtbaren Rahmen

Schema für border, padding und margin

Die Breite eines Rahmens um ein HTML-Element wird durch die CSS-Eigenschaft border-width festgelegt und kann absolut durch die Angabe von Pixeln, Zentimeter oder Millimeter oder relativ zur Schriftgröße durch ems oder durch Schlüsselwörter wie thick oder thin festgelegt werden.

Bei der Angabe der Rahmenbreite muss beachtet werden, dass die Breite des Rahmens zur Breite des HTML-Elements zählt. Wird z.B. für ein Element eine Breite von 300 Pixeln und für den Rahmen eine Breite von 2 Pixeln angegeben, so soll der Browser das Elemente mit einer Breite von insgesamt 304 Pixeln anzeigen (Breite des Elements + Breite des linken und Breite des rechten Rahmens).

border-top-width | border-right-width | border-bottom-width | border-left-width

IE4+ M1 N4+ O5+ S1 CSS1 Erblich: Nein

border-top-width

border-top-width legt die Breite des oberen Rahmens fest.

border-right-width

border-right-width legt die Breite des rechten Rahmens fest.

border-bottom-width

border-bottom-width legt die Breite des unteren Rahmens fest.

border-left-width

border-left-width legt die Breite des linken Rahmens fest.

Werte

thin | medium | thick | length

thin | medium | thick

thin | medium | thick sind Schlüsselwörter, mit denen die Breite der Rahmenlinie gesetzt wird. Plattform und Browser entscheiden aber über deren exakte Breite. Die Voreinstellung ist medium.

length

length kann in einer der folgenden Maßeinheiten angegeben werden: cm (Zentimeter), em (ems), ex (x-Höhe), in (Inch), mm (Millimeter), pc (Pica), pt (Punkt), px (Pixel).

border-width

IE4+ M1 N4+ O5+ Version: CSS1 Erblich: Nein

border-width

border-width setzt die Breite aller vier Rahmenseiten in einer einzigen Deklaration.

Werte

[ ,thin | medium | thick | length ] {1,4}

{1,4} Sie können eine, zwei, drei oder vier Breiten angeben:

• Wird eine Breite angegeben, werden alle vier Rahmenseiten in dieser Breite dargestellt.
• Werden zwei Breiten angeben, werden die obere und untere Rahmenseite mit der ersten Angabe und die rechte und linke Rahmenseite mit der zweiten Breite dargestellt.
• Wenn Sie drei Breiten angeben, wird die obere Rahmenseite mit der ersten, die rechte und linke Rahmenseite mit der zweiten und die untere Rahmenseite mit der dritten Breite dargestellt.
• Wenn Sie vier Breiten angeben, ist die Reihenfolge top, right, bottom, left.

Beispiel: Die Breite eines Rahmens angeben

<div style="border-color: silver; 
    border-style: solid; 
    border-width: thick thin">
    …
</div>

Darstellung

zurück zum Seitenanfang