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

एचटीएमएल डोम स्टाइल मैक्सविड्थ प्रॉपर्टी


DOM style maxWidth गुण HTML दस्तावेज़ में किसी तत्व की अधिकतम चौड़ाई लौटाता है और संशोधित करता है।

सिंटैक्स

निम्नलिखित वाक्य रचना है -

  • रिटर्निंग मैक्सविड्थ

object.style.maxWidth
  • मैक्सविड्थ को संशोधित करना

object.style.maxWidth = “value”

मान

यहाँ, मान हो सकता है -

<वें शैली ="चौड़ाई:83.4693%; पाठ-संरेखण:केंद्र;">स्पष्टीकरण
मान
कोई नहीं यह तत्व की चौड़ाई पर कोई सीमा निर्धारित नहीं करता है।
उत्तराधिकारी इस संपत्ति के मूल्य को इसके मूल तत्व से विरासत में मिला है।
आरंभिक इसने इस गुण मान को उसके डिफ़ॉल्ट मान पर सेट किया।
लंबाई यह मान को चौड़ाई इकाइयों के रूप में सेट करता है।
प्रतिशत(%) यह मूल तत्व की प्रतिशत चौड़ाई के संदर्भ में मान सेट करता है।

उदाहरण

आइए स्टाइल मैक्सविड्थ प्रॉपर्टी का एक उदाहरण देखें -

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      color: #000;
      background-image: linear-gradient(to top, #a18cd1 0%, #fbc2eb 100%);
      height: 100vh;
   }
   p {
      border: 2px solid #fff;
   }
   .btn {
      background: coral;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
   }
</style>
</head>
<body>
<h1>DOM Style maxWidth Property Example</h1>
<p>
   This is paragraph 1 with some dummy text.
   This is paragraph 1 with some dummy text.
   This is paragraph 1 with some dummy text.
   This is paragraph 1 with some dummy text.
   This is paragraph 1 with some dummy text.
   This is paragraph 1 with some dummy text.
</p>
<button onclick="add()" class="btn">Set maxWidth</button>
<script>
   function add() {
      document.querySelector('p').style.maxWidth = "200px";
   }
</script>
</body>
</html>

आउटपुट

यह निम्नलिखित आउटपुट उत्पन्न करेगा -

एचटीएमएल डोम स्टाइल मैक्सविड्थ प्रॉपर्टी

अधिकतम चौड़ाई सेट करें . पर क्लिक करें अनुच्छेद तत्व की अधिकतम चौड़ाई निर्धारित करने के लिए बटन -

एचटीएमएल डोम स्टाइल मैक्सविड्थ प्रॉपर्टी


  1. एचटीएमएल डोम स्टाइल काउंटर रीसेट संपत्ति

    HTML DOM Style counterReset प्रॉपर्टी का उपयोग काउंटर को एक निश्चित मान पर रीसेट करने या एक बनाने के लिए किया जाता है। इसका उपयोग आमतौर पर काउंटर को बढ़ाने या घटाने के लिए काउंटर-इंक्रीमेंट प्रॉपर्टी के साथ किया जाता है। − . के लिए वाक्य रचना निम्नलिखित है काउंटर रीसेट गुण सेट करना - object.style.

  1. HTML DOM स्टाइल काउंटरइन्क्रीमेंट प्रॉपर्टी

    HTML DOM Style counterIncrement प्रॉपर्टी का उपयोग एक या अधिक CSS काउंटर के मान को बढ़ाने या घटाने के लिए किया जाता है। इसका उपयोग आमतौर पर काउंटर रीसेट और सामग्री संपत्ति के साथ किया जाता है। − . के लिए वाक्य रचना निम्नलिखित है काउंटरइन्क्रिमेंट प्रॉपर्टी सेट करना - object.style.counterIncrement

  1. एचटीएमएल डोम मूल्य संपत्ति

    HTML DOM मान गुण किसी तत्व की विशेषता के मान के अनुरूप स्ट्रिंग लौटाता है। निम्नलिखित वाक्य रचना है - रिटर्निंग स्ट्रिंग मान elementAttribute.value आइए HTML DOM मान का एक उदाहरण देखें संपत्ति - उदाहरण <!DOCTYPE html> <html> <head> <title>HTML DOM value</title> <st