CSS Kenarlık Renkleri

CSS Kenarlık Renkleri

border-color Bu özellik, dört çerçevenin rengini ayarlamak için kullanılır.

Renkleri aşağıdaki gibi ayarlayabilirsiniz:

  • name - Renk adını belirtin, örneğin "red"
  • HEX - Onaltılık değeri belirtin, örneğin "#ff0000"
  • RGB - RGB değeri belirtin, örneğin "rgb(255,0,0)"
  • HSL - HSL değeri belirtin, örneğin "hsl(0, 100%, 50%)"
  • transparent

Açıklama:Eğer ayarlanmamışsa border-colorise, elementin rengini devralır.

Örnek

Farklı çerçeve renklerini gösterme:

p.one {
  border-style: solid;
  border-color: red;
}
p.two {
  border-style: solid;
  border-color: green;
}
p.three {
  border-style: dotted;
  border-color: blue;
}

Sonuç:

Kırmızı çizgili çerçeve

Yeşil çizgili çerçeve

Mavi noktalı çerçeve

Kişisel olarak deneyin

Belirli çerçeve rengi

border-color Özellik, bir ila dört değer ayarlayabilir (üst çerçeve, sağ çerçeve, alt çerçeve ve sol çerçeve için kullanılır).

Örnek

p.one {
  border-style: solid;
  border-color: red green blue yellow; /* 上红、右绿、下蓝、左黄 */
}

Kişisel olarak deneyin

HEX Değerleri

Kenar çizgisi rengi, ondalık değer olarak HEX (onaltılık) kullanılarak da belirlenebilir:

Örnek

p.one {
  border-style: solid;
  border-color: #ff0000; /* Kırmızı */
}

Kişisel olarak deneyin

RGB Değerleri

veya RGB değerlerini kullanabilirsiniz:

Örnek

p.one {
  border-style: solid;
  border-color: rgb(255, 0, 0); /* Kırmızı */
}

Kişisel olarak deneyin

HSL Değerleri

Ayrıca HSL değerlerini kullanabilirsiniz:

Örnek

p.one {
  border-style: solid;
  border-color: hsl(0, 100%, 50%); /* Kırmızı */
}

Kişisel olarak deneyin

Bizim CSS Renkleri HEX, RGB ve HSL değerleri hakkında daha fazla bilgi öğrenmek için bölümlerde öğrendiklerinizden yararlanabilirsiniz.