CSS -Rahmenfarbe
CSS-Rahmenfarbe
Die border-colorEigenschaft wird verwendet, um die Farbe der vier Rahmen festzulegen.
Die Farbe kann eingestellt werden durch:
- name - Geben Sie einen Farbnamen an, z. B. "rot".
- HEX - geben Sie einen HEX-Wert an, wie "#ff0000"
- RGB - Geben Sie einen RGB-Wert an, z. B. "rgb(255,0,0)".
- HSL – Geben Sie einen HSL-Wert an, z. B. „hsl(0, 100 %, 50 %)“.
- transparent
Hinweis: Wenn border-colornicht gesetzt ist, erbt es die Farbe des Elements.
Beispiel
Demonstration der verschiedenen Randfarben:
p.one
{
border-style: solid;
border-color: red;
}
p.two
{
border-style: solid;
border-color: green;
}
p.three {
border-style: dotted;
border-color:
blue;
}
Ergebnis:
Red border
Green border
Blue border
Spezifische Seitenfarben
Die border-colorEigenschaft kann einen bis vier Werte haben (für den oberen Rand, den rechten Rand, den unteren Rand und den linken Rand).
Beispiel
p.one {
border-style: solid;
border-color: red green blue yellow;
/* red top, green right, blue bottom and yellow left */
}
HEX-Werte
Die Farbe des Rahmens kann auch über einen Hexadezimalwert (HEX) angegeben werden:
Beispiel
p.one {
border-style: solid;
border-color: #ff0000; /* red
*/
}
RGB-Werte
Oder mit RGB-Werten:
Beispiel
p.one {
border-style: solid;
border-color: rgb(255, 0, 0);
/* red */
}
HSL-Werte
Sie können auch HSL-Werte verwenden:
Beispiel
p.one {
border-style: solid;
border-color: hsl(0, 100%, 50%);
/* red */
}
Mehr über HEX-, RGB- und HSL-Werte erfahren Sie in unseren Kapiteln zu CSS-Farben .