CSS Border Stil

Ich möchte einen gepunkteten oder gestrichelten Rand in html haben?
Ich möchte eine Doppelgerade um meinem Abschnitt herum haben?
Wie kann ich eine Erhöhung oder einHow to draw a ridge or groove Stil Rand mit einer Stylesheet?

Erklärung

Eigenschaft:

Border Style
Verwendung:
border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;
border-style: groove;
border-style: ridge;
border-style: inset;
border-style: outset;

Definition:

Der Stil des Rands kann mit dem tag border-style Tag eingestellt werden. Border Style nimmt die folgenden werten an.
a)dotted- Das wird einen Rand mit Punktlinien erstellen.
b)dashed- Das wird einen Rand mit gestrichelten Linien erstellen.
c)solid- Das wird einen Rand mit vollen Linien erstellen.
d)double- Das wird einen Rand mit doppelten Linien erstellen.
e)groove- Das wird einen Rand erstellen, der wie groove aussieht.
f)ridge- Das wird einen Rand erstellen, der wie ridge aussieht.
g)inset- This will create a border with the line looking inset.
h)outset- This will create a border with the line looking outset.

Beispiel 1:
<div style="border-width: 2px; border-style: dotted; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen


Beispiel 2:
<div style="border-width: 2px; border-style: dashed; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen

Beispiel 3:
<div style="border-width: 2px; border-style: solid; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen


Beispiel 4:
<div style="border-width: 4px; border-style: double; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen


Beispiel 5:
<div style="border-width: 4px; border-style: groove; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen


Beispiel 6:
<div style="border-width: 4px; border-style: ridge; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen


Beispiel 7:
<div style="border-width: 4px; border-style: inset; border-color: red; "> Rand Stil testen</div>
Result:
Rand Stil testen


Beispiel 8:
<div style="border-width: 4px; border-style: outset; border-color: red; "> Rand Stil testen</div>
Ergebnis:
Rand Stil testen