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;
}

Результат:

अगले पाठों में, हम बॉर्डर के साथ काम करने को और अधिक विस्तार से देखेंगे।