Border

Der Boder braucht 3 Werte, Border-Farbe, Border-Style und Border-Breite, ohne die er nicht dargestellt wird.

Farbe
border-color: Hexcode, rgb oder rgba;
Rahmenbreite
border-width: Pixel oder EM
Rahmenstyle
border-style: solid, dotted, dashed, double, groove, inset, outset

Beispiele

Folgende Angaben gelten für alle Beispiele

.one, .two, .three, .four, .five, .six, .seven   {
		border-width: 5px;
		border-color: #F67;
		}

Rahmenstyle solid

.one {border-style: solid;}

Rahmenstyle dotted

.two {border-style: dotted;}

Rahmenstyle dashed

.three {border-style: dashed;}

Rahmenstyle double

.four {border-style: double;}

Rahmenstyle groove

.five {border-style: groove;}

Rahmenstyle inset

.six {border-style: inset;}

Rahmenstyle outset

.seven {border-style: outset;}

Rahmenstyle solid groove dotted double

.eight{
border-color: black red aqua magenta;
border-width: 5px 6px 7px 8px;
border-style: solid groove dotted double;
}

Rahmenstyle mix

.nine{
border-color: black;
border-top-width: 1px;
border-right-width: 2px;
border-bottom-width: 3px;
border-left-width: 4px;
border-style: solid;

Die Rahmenbreite kann auch zusammengasst werden: border-width: 1px 2px 3px 4px;

Kurzschreibweise Border

Die Reihenfolge wird im Uhrzeigersinn angegeben: oben, rechts, unten, links.

border: 1px solid #000;

Nur der untere Rahmen wird angesprochen.

border-bottom: 1px solid #000;