परिचय
`padding-left` प्रॉपर्टी एलिमेंट के बाएं पैडिंग (कंटेंट और बॉर्डर के बीच की जगह) सेट करती है।
सिंटैक्स
padding-left: <length> | <percentage>;
मान
- Length: px, em, rem, pt, cm, आदि (नकारात्मक नहीं)
- Percentage: कंटेनिंग ब्लॉक की चौड़ाई का प्रतिशत
उदाहरण
<html>
<head>
<style>
.demo-box {
border: 2px solid blue;
margin: 10px 0;
}
</style>
</head>
<body>
<p class="demo-box" style="padding-left: 20px;">
20px बाएं पैडिंग के साथ डेमो कंटेंट।
</p>
<p class="demo-box" style="padding-left: 20%;">
20% बाएं पैडिंग (कंटेनर चौड़ाई के सापेक्ष)।
</p>
<p class="demo-box" style="padding-left: 2em;">
2em बाएं पैडिंग (फॉन्ट साइज के सापेक्ष)।
</p>
</body>
</html>
संबंधित प्रॉपर्टीज
- `padding-right` - दायां पैडिंग
- `padding-top` - ऊपर पैडिंग
- `padding-bottom` - नीचे पैडिंग
- `padding` - शॉर्टहैंड (ऊपर, दाएं, नीचे, बाएं)
बॉक्स मॉडल संदर्भ
+----------------------------------+ | Margin | | +----------------------------+ | | | Border | | | | +----------------------+ | | | | | Padding-Left | | | ← padding-left यहां है | | | +--------------+ | | | | | | | Content | | | | | | | +--------------+ | | | | | +----------------------+ | | | +----------------------------+ | +----------------------------------+