X

Yazar: 16 Haziran 2023

Border css Kullanımı

CSS’de border özelliği, bir HTML öğesinin etrafında kenarlık oluşturmak için kullanılır. Bu özellik, kenarlık rengini, kalınlığını ve stili belirlemenize olanak tanır. İşte border özelliğinin kullanımıyla ilgili bilgiler:

border özelliği, aşağıdaki şekilde kullanılabilir:

  1. border-width: Kenarlığın kalınlığını belirler. Örneğin, border-width: 2px; kenarlığın 2 piksel kalınlığında olacağını belirtir.
  2. border-style: Kenarlık stilini belirler. Bazı yaygın kullanılan değerler arasında solid (düz çizgi), dotted (noktalı), dashed (kesikli) ve double (çift çizgi) bulunur. Örneğin, border-style: dashed; kenarlığın kesikli bir stile sahip olacağını belirtir.
  3. border-color: Kenarlık rengini belirler. Örneğin, border-color: red; kenarlığın kırmızı renkte olacağını belirtir. Ayrıca, border-color değerine birden çok renk de verebilirsiniz, böylece farklı kenarlar farklı renklere sahip olabilir.
  4. Kısa bir formda, yukarıdaki üç özelliği bir arada kullanabilirsiniz. Örneğin, border: 2px solid red; ifadesi, kenarlığın 2 piksel kalınlığında, düz çizgi stilinde ve kırmızı renkte olacağını belirtir.

border özelliği ayrıca kenarların ayrı ayrı kontrol edilmesini sağlayan aşağıdaki özelliklere de sahiptir:

  • border-top: Üst kenarlığı belirler.
  • border-right: Sağ kenarlığı belirler.
  • border-bottom: Alt kenarlığı belirler.
  • border-left: Sol kenarlığı belirler.

div {
border: 2px solid red; /* Kenarlık kalınlığı 2 piksel, düz çizgi stilinde, kırmızı renkte */
border-top: 1px dotted blue; /* Üst kenarlık kalınlığı 1 piksel, noktalı stil, mavi renkte */
border-left: 3px double green; /* Sol kenarlık kalınlığı 3 piksel, çift çizgi stilinde, yeşil renkte */
}

Daha Fazla Bilgi İçin Web Tasarım Ankara Ekibimizle İletişime Geçebilirsiniz.