HTML DOM Style paddingLeft प्रॉपर्टी

style.paddingLeft प्रॉपर्टी क्या है?

DOM style.paddingLeft प्रॉपर्टी किसी तत्व के बाएं पैडिंग (आंतरिक स्थान) को प्राप्त या सेट करती है। यह CSS padding-left प्रॉपर्टी के अनुरूप है।

सिंटैक्स

बाएं पैडिंग प्राप्त करना

object.style.paddingLeft

बाएं पैडिंग सेट करना

object.style.paddingLeft = "value"

मान

• लंबाई इकाइयाँ: px, em, rem, %, vh, vw, आदि।
• inherit, initial, unset।

उदाहरण

यह उदाहरण एक पैराग्राफ पर बाएं पैडिंग जोड़ता है:

<!DOCTYPE html>
<html>
<head>
<style>
  body { color: #000; background: lightblue; height: 100vh; }
  p { border: 2px solid #fff; }
  .btn {
    background: #db133a;
    border: none;
    height: 2rem;
    border-radius: 2px;
    width: 40%;
    display: block;
    color: #fff;
    outline: none;
    cursor: pointer;
    margin: 1rem auto;
  }
</style>
</head>
<body>
<h1>DOM Style paddingLeft प्रॉपर्टी उदाहरण</h1>
<p>नमस्ते! मैं कुछ रैंडम टेक्स्ट वाला एक बहुत बढ़िया पैराग्राफ हूँ। नमस्ते! मैं कुछ रैंडम टेक्स्ट वाला एक बहुत बढ़िया पैराग्राफ हूँ। नमस्ते! मैं कुछ रैंडम टेक्स्ट वाला एक बहुत बढ़िया पैराग्राफ हूँ। नमस्ते! मैं कुछ रैंडम टेक्स्ट वाला एक बहुत बढ़िया पैराग्राफ हूँ।</p>
<button onclick="addPadding()" class="btn">पैडिंग जोड़ें</button>
<script>
  function addPadding() {
    document.querySelector('p').style.paddingLeft = "30px";
  }
</script>
</body>
</html>

आउटपुट

"पैडिंग जोड़ें" बटन पर क्लिक करने पर, पैराग्राफ को 30px बाएं पैडिंग मिलती है, जिससे टेक्स्ट दाएं खिसक जाता है।

पैडिंग प्रॉपर्टीज़ सारांश

नोट्स

• रिटर्न किया गया मान एक स्ट्रिंग है जिसमें इकाई शामिल होती है (उदाहरण: "30px")।
<यदि CSS में सेट नहीं किया गया है, तो खाली स्ट्रिंग "" लौटाता है (गणना मान के लिए getComputedStyle() का उपयोग करें)।
• पैडिंग तत्व के अंदर स्थान जोड़ती है; मार्जिन बाहर जोड़ती है।
• नकारात्मक मान अमान्य हैं (अनदेखे किए जाते हैं)।