HTML एलिमेंट में टेक्स्ट को इंडेंट करने की आवश्यकता है? आप CSS का उपयोग करके पैराग्राफ की पहली लाइन को इंडेंट कर सकते हैं!
यहां बताया गया है कि आप ऐसा कैसे कर सकते हैं:
text-indent के साथ पैराग्राफ की पहली लाइन को इंडेंट करें
मान लें कि आपके पास पैराग्राफ में कुछ टेक्स्ट है जैसे:
<p class="indent"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa sit aperiam deserunt quae excepturi fugit, consequuntur cum corporis illum natus quibusdam quasi ab at. Laboriosam aperiam aut laborum animi soluta eligendi iste doloribus error, ex eius magnam? Aperiam illum nam cupiditate omnis. Repudiandae doloribus voluptatibus, animi quas incidunt eveniet fugiat! </p>आप पहली लाइन को एक विशिष्ट लंबाई से इंडेंट करने के लिए CSS प्रॉपर्टी text-indent का उपयोग कर सकते हैं:
p.indent { text-indent: 30px; }और यह इस तरह दिखेगा:
अन्य CSS लंबाई प्रॉपर्टीज़ की तरह, आप इसके लिए किसी भी यूनिट का उपयोग कर सकते हैं। पिक्सेल (px), em, rem, यहां तक कि प्रतिशत (%) यूनिट्स भी काम करेंगे।
प्रतिशत जैसी सापेक्ष यूनिट का उपयोग करने से वेबपेज की चौड़ाई के आधार पर इंडेंटेशन की मात्रा बदल जाएगी। वेबपेज जितना चौड़ा होगा, इंडेंट उतना ही बड़ा होगा।
आप नकारात्मक text-indent मान भी जोड़ सकते हैं यदि आप चाहते हैं, ताकि पहली लाइन बाईं ओर निकल जाए।
p.indent { text-indent: -30px; }यहां पैराग्राफ में नकारात्मक इंडेंट कैसा दिखेगा:
यदि आप पूरे पैराग्राफ को दाईं ओर शिफ्ट करना चाहते हैं तो margin-left का उपयोग करें
यदि आप केवल पहली लाइन नहीं, बल्कि पूरे पैराग्राफ को शिफ्ट करना चाहते हैं, तो आप margin-left प्रॉपर्टी का उपयोग कर सकते हैं।
p.shifted { margin-left: 30px; }यह इस तरह दिखेगा। पहला पैराग्राफ शिफ्ट नहीं हुआ है, और दूसरा पैराग्राफ है:
