CSS से बॉर्डर की शैली सेट करें

बॉर्डर की शैली सेट करने के लिए, border-style गुण का उपयोग करें। border-style गुण आपको निम्नलिखित बॉर्डर शैलियों में से एक चुनने की अनुमति देता है:

• none: कोई बॉर्डर नहीं
• solid: बॉर्डर एक सिंगल सॉलिड लाइन है।
• dotted: बॉर्डर डॉट्स की एक श्रृंखला है।
• dashed: बॉर्डर छोटी लाइनों की एक श्रृंखला है।
• double: बॉर्डर दो सॉलिड लाइनें हैं।
• groove: बॉर्डर ऐसा लगता है जैसे पेज में उकेरा गया हो।
• ridge: बॉर्डर groove के विपरीत दिखता है।
• inset: बॉर्डर बॉक्स को ऐसा दिखाता है जैसे यह पेज में एम्बेडेड हो।
• outset: बॉर्डर बॉक्स को ऐसा दिखाता है जैसे यह कैनवास से बाहर आ रहा हो।
• hidden: none के समान, टेबल तत्वों के लिए बॉर्डर-संघर्ष समाधान के संदर्भ में छोड़कर।

उदाहरण

निम्न कोड चलाकर बॉर्डर की शैली सेट करें:

<html>
  <head>
  </head>
  <body>.
    <p style="border-width:4px; border-style:none;">
      This is a border with none width.
    </p>
    <p style="border-width:4px; border-style:solid;">
      This is a solid border.
    </p>
    <p style="border-width:4px; border-style:dashed;">
      This is a dashed border.
    </p>
    <p style="border-width:4px; border-style:double;">
      This is a double border.
    </p>
    <p style="border-width:4px; border-style:groove;">
      This is a groove border.
    </p>
  </body>
</html>