http://jendryschik.de / archiv / einfuehrung / rahmen.html

4. Styling von Webseiten

  Positionierung von Elementen

Rahmen

Mit folgenden Angaben können Sie einen Rahmen um ein Element deklarieren:

border-width

Damit bestimmen Sie die Dicke des Rahmens. Es sind die Angaben thin (dünn), medium (mittel), thick (dick) und ein numerischer Wert möglich.

border-top-width, border-bottom-width, border-left-width- border-right-width

Hiermit bestimmen Sie die Dicke des Rahmens für alle vier Seiten seperat.

border-color

Bestimmen Sie die Farbe des Rahmens.

border-style

Hiermit bestimmen Sie die Stilart des Rahmens. Sie haben folgende Angabemöglichkeiten: none (kein Rahmen bzw. unsichtbarer Rahmen), dotted (gepunktet), dashed (gestrichelt), solid (durchgezogen), double (doppelt durchgezogen), groove (3D-Effekt), ridge (3D-Effekt), inset (3D-Effekt) und outset (3D-Effekt).

border

Diese Angabe ist eine Zusammenfassung der vorhergehenden Einzelangaben, die wie folgt aussehen könne:
<div style="border : 2px solid #ffd;">Beispiel</div>.

Die aktuellen Mozilla Versionen (also auch Netscape 6) bieten die proprietäre Möglichkeiten, runde Ecken für Blockelemente einzurichten. In anderen Browsern werden diese Effekte nicht angezeigt. Es gibt zusätzlich zu den gewöhnlichen Rahmendefinitionen noch folgende Angaben:

-moz-border-radius

Den Radius bestimmen Sie z. B. mit Pixelwerten.

-moz-border-radius-topleft, -moz-border-radius-topright, -moz-border-radius-bottomleft, -moz-border-radius-bottomright

Mit diesen vier Werten kann man den Radius für jede Ecke einzeln bestimmen. Die vier Werte sind wie z. B. bei Padding in einer Zeile zusammenzufassen.

Eine Angabe des Mozilla-Borders würde z. B. wie folgt aussehen:

border: 3px solid #309;
-moz-border-radius: 0 20px;

  Pseudoklassen und -elemente