HTML DOM स्टाइल maxWidth प्रॉपर्टी

परिचय

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

सिंटैक्स

मान प्राप्त करना

object.style.maxWidth

मान सेट करना

object.style.maxWidth = "value"

मान

मान	व्याख्या
none	एलिमेंट की चौड़ाई पर कोई सीमा नहीं सेट करता।
inherit	पैरेंट एलिमेंट से इस प्रॉपर्टी का मान विरासत में लेता है।
initial	इस प्रॉपर्टी का मान इसके डिफ़ॉल्ट मान पर सेट करता है।
length	चौड़ाई इकाइयों (px, em, आदि) के रूप में मान सेट करता है।
percentage(%)	पैरेंट एलिमेंट की चौड़ाई के प्रतिशत के रूप में मान सेट करता है।

उदाहरण

पैराग्राफ एलिमेंट की अधिकतम चौड़ाई सेट करना:

<!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 स्टाइल maxWidth प्रॉपर्टी उदाहरण</h1>
<p>
  यह पैराग्राफ 1 कुछ डमी टेक्स्ट के साथ है।
  यह पैराग्राफ 1 कुछ डमी टेक्स्ट के साथ है।
  यह पैराग्राफ 1 कुछ डमी टेक्स्ट के साथ है।
  यह पैराग्राफ 1 कुछ डमी टेक्स्ट के साथ है।
  यह पैराग्राफ 1 कुछ डमी टेक्स्ट के साथ है।
  यह पैराग्राफ 1 कुछ डमी टेक्स्ट के साथ है।
</p>
<button onclick="add()" class="btn">maxWidth सेट करें</button>
<script>
  function add() {
    document.querySelector('p').style.maxWidth = "200px";
  }
</script>
</body>
</html>

आउटपुट

"maxWidth सेट करें" बटन पर क्लिक करने पर पैराग्राफ एलिमेंट की अधिकतम चौड़ाई 200px सेट हो जाएगी।