CSSda chegaralar bilan ishlash asoslari

Hozir biz elementlarga chegaralar qo'shishni o'rganamiz. Bu uchta xususiyat yordamida amalga oshiriladi: border-width xususiyati chegaraning qalinligini belgilaydi, border-color - rangini, va border-style chegaraning turini belgilaydi.

Birinchi ikkita xususiyat aniq tarzda ishlaydi: border-color color xususiyati kabi formatdagi ranglarni qabul qiladi, chegaraning qalinligi esa piksellarda belgilanadi. border-style xususiyati esa kalit so'zlar shaklida qiymatlarni qabul qiladi. Masalan, solid qiymati uzluksiz chiziqni belgilaydi.

Keling, masalan, 3 piksellik qalinlikdagi, uzluksiz chiziq shaklida, qizil rangdagi chegarani yarataylik:

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

css#elem {
  border-width: 3px;    /* 3px qalinlik */
  border-style: solid;  /* chiziq shaklida */
  border-color: red;    /* qizil rang */
  width: 300px;
  height: 100px;
}

Результат:

Keyingi darslarda biz chegaralar bilan ishlashni batafsilroq ko'rib chiqamiz.