HTML में टेक्स्ट को केंद्र में कैसे संरेखित करें
प्रोग्रामर्स के रूप में हम पहली चीजों में से एक सीखते हैं वह है टेक्स्ट के ब्लॉक्स को संरेखित करना। इस लेख में, हम स्टाइल और अलाइन विशेषताओं का उपयोग करके अपने कंटेनर के केंद्र में टेक्स्ट को संरेखित करने के तरीके पर एक नज़र डालेंगे।
स्टाइल विशेषताएँ (Style Attributes)
जब हम HTML में एक div के साथ काम कर रहे होते हैं, तो हम इंलाइन-स्टाइलिंग को शामिल करने के लिए स्टाइल विशेषता का उपयोग कर सकते हैं। हम अपने टेक्स्ट को <div> में केंद्रित करने के लिए CSS प्रॉपर्टी text-align का उपयोग करेंगे।
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>स्टाइल विशेषता के साथ केंद्र</title> </head> <body> <div class="container" style="text-align:center;"> <p>केंद्र करने के लिए टेक्स्ट</p> </div> </body> </html>
अलाइन विशेषताएँ (Align Attributes)
हम HTML में टेबल्स के साथ काम करते समय अलाइन विशेषताओं का उपयोग कर सकते हैं। यह केवल <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead>, <tr> एलिमेंट्स पर काम करेगा।
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>अलाइन विशेषता के साथ केंद्र</title> </head> <body> <table border=1 width="800" align="center"> <tr> <th>महीना</th> <th>बचत</th> </tr> <tr align="center"> <td>जनवरी</td> <td>$100</td> </tr> <tr align="center"> <td>फरवरी</td> <td>$80</td> </tr> </table> </body> </html>
याद रखने वाली बड़ी बात जब आप टेक्स्ट को केंद्र करना सीख रहे हैं वह यह है कि संरेखण उस कंटेनर पर निर्भर करता है जिसमें यह है। यदि कंटेनर केवल आधे पेज को लेता है, तो यह उस कंटेनर की लंबाई में खुद को केंद्रित करेगा न कि पूरे पेज पर।
बस इतना ही! अब आप जानते हैं कि <div> एलिमेंट और <table> एलिमेंट्स में टेक्स्ट को कैसे केंद्रित करना है।