Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> Javascript

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

<घंटा/>

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

  • कोई नहीं: कोई सीमा नहीं
  • ठोस: सीमा एक ठोस रेखा है।
  • बिंदीदार: बॉर्डर बिंदुओं की एक श्रृंखला है।
  • धराशायी: सीमा छोटी रेखाओं की एक श्रृंखला है।
  • दोहरा: सीमा दो ठोस रेखाएँ हैं।
  • नाली: बॉर्डर ऐसा लगता है जैसे इसे पृष्ठ में उकेरा गया हो।
  • रिज: बॉर्डर खांचे के विपरीत दिखता है।
  • इनसेट: बॉर्डर बॉक्स को ऐसा दिखता है जैसे वह पेज में एम्बेड किया गया हो।
  • शुरुआत: बॉर्डर बॉक्स को ऐसा दिखता है जैसे वह कैनवास से बाहर आ रहा है।
  • छिपा हुआ: तालिका तत्वों के लिए सीमा-संघर्ष समाधान के अलावा कोई भी नहीं।

उदाहरण

आप बॉर्डर की शैली सेट करने के लिए निम्न कोड चलाने का प्रयास कर सकते हैं:

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

  1. CSS के साथ इनसेट बॉर्डर सेट करें

    CSS के साथ इनसेट बॉर्डर सेट करने के लिए, बॉर्डर-शैली . का उपयोग करें मूल्य इनसेट के साथ संपत्ति। उदाहरण <html>    <head>    </head>    <body>       <p style = "border-width:4px; border-style:none;">     &n

  1. CSS के साथ बॉर्डर इमेज की चौड़ाई सेट करें

    बॉर्डर-इमेज-चौड़ाई प्रॉपर्टी का इस्तेमाल सीएसएस के साथ बॉर्डर इमेज की चौड़ाई सेट करने के लिए किया जाता है। उदाहरण आप सीमा-छवि-चौड़ाई संपत्ति को लागू करने के लिए निम्न कोड चलाने का प्रयास कर सकते हैं - <html>    <head>       <style>       &n

  1. CSS का उपयोग करके नीचे की सीमा की शैली सेट करें

    बॉटम बॉर्डर की स्टाइल सेट करने के लिए, बॉर्डर-बॉटम-स्टाइल प्रॉपर्टी का इस्तेमाल करें। आपके द्वारा सेट किए जा सकने वाले बॉर्डर के मान डॉटेड, डबल, डैश्ड, सॉलिड आदि हैं। उदाहरण आप निम्न कोड को स्टाइल बॉटम बॉर्डर पर चलाने का प्रयास कर सकते हैं <!DOCTYPE html> <html>    <head>