HTML DOM स्टाइल पैडिंगराइट प्रॉपर्टी वापस आती है और HTML एलीमेंट में राइट पैडिंग जोड़ती है।
सिंटैक्स
निम्नलिखित वाक्य रचना है -
1. रिटर्निंग पैडिंगराइट
object.style.paddingRight
2. पैडिंग जोड़नाराइट
object.style.paddingRight=”value”
यहां, “मान "निम्नलिखित हो सकते हैं -
| मान | विवरण |
|---|---|
| लंबाई | यह लंबाई इकाई में मान पैडिंग को परिभाषित करता है। |
| प्रारंभिक | यह पैडिंग को उसके डिफ़ॉल्ट मान पर परिभाषित करता है। |
| उत्तराधिकारी | इसमें पैडिंग अपने मूल तत्व से विरासत में मिलती है। |
| प्रतिशत (%) | यह मूल तत्व की चौड़ाई के प्रतिशत में पैडिंग को परिभाषित करता है। |
आइए HTML DOM स्टाइल पैडिंग राइट प्रॉपर्टी का एक उदाहरण देखें-
उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
.outer-box {
background-color: #db133a;
width: 300px;
height: 300px;
margin: 1rem auto;
}
.inner-box {
background-color: #C3C3E6;
width: 100%;
height: 150px;
}
</style>
</head>
<body>
<h1>HTML DOM Style paddingRight Property Demo</h1>
<div class="outer-box">
<div class="inner-box">
</div>
</div>
<button type="button" onClick='addPadding()'>Add Padding</button>
<script>
function addPadding() {
var outerBox = document.querySelector('.outer-box')
outerBox.style.paddingRight = '20px';
}
</script>
</body>
</html> आउटपुट
लाल बॉक्स के अंदर पैडिंग जोड़ने के लिए "पैडिंग जोड़ें" बटन पर क्लिक करें।
