CSSда чеккалар билан ишлашнинг асослари

Ҳозирда биз элементларга чекка қўшишни ўрганамиз. Бу учта хусусият ёрдамида бажарилади: border-width хусусияти чекканинг қалинлигини белгилайди, border-color - рангни, ва border-style чекка турини белгилайди.

Биринчи икки хусусият аниқ тарзда ишлайди: border-color хусусияти color хусусияти билан ўхшаш форматда рангларни қабул қилади, ва чекканинг қалинлиги пикселларда белгиланади. Аммо border-style хусусияти калит сўзлар шаклидаги қийматларни қабул қилади. Масалан, solid қиймати ўзбек ўтказгичли чизиқни белгилайди.

Масалан, қалинлиги 3 пиксел, ўзбек ўтказгичли чизиқ шаклида, қизил рангдаги чекка яратайлик:

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

css#elem {
  border-width: 3px;    /* қалинлик 3px */
  border-style: solid;  /* чизиқ шаклида */
  border-color: red;    /* қизил ранг */
  width: 300px;
  height: 100px;
}

Результат:

Кейинги дарсларда биз чеккалар билан ишлашни батафсилрок кўриб чиқамиз.