CSS'de Kenarlıklarla Çalışmanın Temelleri

Şimdi elementlere kenarlık eklemeyi öğreneceğiz. Bu, üç özellik kullanılarak yapılır: border-width özelliği kenarlık kalınlığını belirler, border-color rengini, ve border-style ise kenarlık stilini belirler.

İlk iki özellik açık bir şekilde çalışır: border-color, color özelliğiyle aynı formatta renkleri alır, ve kenarlık kalınlığı piksel olarak belirlenir. Ancak border-style özelliği anahtar kelimeler şeklinde değerler alır. Örneğin, solid değeri düz bir çizgi belirler.

Örneğin, 3 piksel kalınlığında, düz çizgi şeklinde, kırmızı renkte bir kenarlık yapalım:

html<div id="elem"></div>

css#elem {
  border-width: 3px;    /* 3px kalınlık */
  border-style: solid;  /* çizgi şeklinde */
  border-color: red;    /* kırmızı renk */
  width: 300px;
  height: 100px;
}

Результат:

Sonraki derslerde kenarlıklarla çalışmayı daha ayrıntılı olarak inceleyeceğiz.