CSS Kenarlık Yuvarlak

CSS Kenarlık Yuvarlak

border-radius Özellik, elemente yuvarlak köşeli çerçeve eklemek için kullanılır:

Normal çerçeve

Küçük köşeli çerçeve

Küçük köşeli çerçeve

Küçük köşeli çerçeve

Örnek

p {
  border: 2px solid red;
  border-radius: 5px;
}

Kişisel olarak deneyin

Daha fazla örnek

Bir açıklamadaki tüm üst çizgi özellikleri
Bu örnek, bir açıklamada üst çizgının tüm özelliklerini ayarlamak için kullanılan kısa özellikleri gösterir.
Alt çizgının tarzını ayarlamak
Bu örnek, alt çizgının tarzını nasıl ayarladığını gösterir.
Sol kenar çubuğunun genişliğini ayarlayın
Bu örnek, sol kenar çubuğunun genişliğini nasıl ayarlandığını gösterir.
Dört kenar çubuğun rengini ayarlayın
Bu örnek, dört kenar çubuğun rengini nasıl ayarlandığını gösterir. Bir ila dört renk olabilir.
Sağ kenar çubuğunun rengini ayarlayın
Bu örnek, sağ kenar çubuğunun rengini nasıl ayarlandığını gösterir.

Tüm CSS kenar çubuğu özellikleri

Özellik Tanım
border Kısaltma özelliği, bir ifadede tüm kenar çubuk özelliklerini ayarlar.
border-color Kısaltma özelliği, dört kenar çubuğun rengini ayarlar.
border-radius Kısaltma özelliği, dört kenar çubuğun tüm border-*-radius özelliklerini ayarlar.
border-style Kısaltma özelliği, dört kenar çubuğun tarzını ayarlar.
border-width Kısaltma özelliği, dört kenar çubuğun genişliğini ayarlar.
border-bottom Kısaltma özelliği, bir ifadede tüm alt çubuk özelliklerini ayarlar.
border-bottom-color Alt çubuğun rengini ayarlayın.
border-bottom-style Alt çubuğun tarzını ayarlayın.
border-bottom-width Alt çubuğun genişliğini ayarlayın.
border-left Kısaltma özelliği, bir ifadede tüm sol çubuk özelliklerini ayarlar.
border-left-color Sol çubuğun rengini ayarlayın.
border-left-style Sol çubuğun tarzını ayarlayın.
border-left-width Sol çubuğun genişliğini ayarlayın.
border-right Kısaltma özelliği, bir ifadede tüm sağ çubuk özelliklerini ayarlar.
border-right-color Sağ çubuğun rengini ayarlayın.
border-right-style Sağ çubuğun tarzını ayarlayın.
border-right-width Sağ çubuğun genişliğini ayarlayın.
border-top Kısaltma özelliği, bir ifadede tüm üst çubuk özelliklerini ayarlar.
border-top-color Üst çubuğun rengini ayarlayın.
border-top-style Üst çubuğun tarzını ayarlayın.
border-top-width Üst çubuğun genişliğini ayarlayın.