Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> HTML

HTML <div> एलिमेंट का उपयोग कैसे करें

HTML <div> एलिमेंट का उपयोग करना सीखें।

<div> एलिमेंट एक जेनेरिक कंटेनर एलिमेंट है जिसका उपयोग कंटेंट को विभाजित, समूहित और एनकैप्सुलेट करने के लिए किया जाता है।

आपको <div> एलिमेंट का उपयोग केवल तभी करना चाहिए यदि कोई सिमेंटिक HTML एलिमेंट संदर्भ के सापेक्ष उपयोग करने के लिए समझ में नहीं आता (या यदि आप सुनिश्चित नहीं हैं)।

सिमेंटिक मार्कअप तब होता है जब आप HTML एलिमेंट्स का उपयोग करते हैं जो आपके द्वारा अंदर रखे गए कंटेंट के अर्थ/कार्य का वर्णन करते हैं। <div> एलिमेंट एक जेनेरिक/अन-सिमेंटिक एलिमेंट है।

<div> एलिमेंट के उपयोग के मामले

मान लें कि आप अपनी वेबसाइट के लिए एक पुन: प्रयोज्य मॉडल कंपोनेंट कोड कर रहे हैं, जो आपके साइट विजिटर्स को आपके न्यूज़लेटर की सदस्यता लेने के लिए प्रोत्साहित करता है।

ऐसे कंपोनेंट को परिभाषित करने के लिए कोई पूर्व-मौजूदा सिमेंटिक HTML टैग नहीं है, इसलिए यह जेनेरिक <div> कंटेनर एलिमेंट का उपयोग करने का एक आदर्श उदाहरण है:

<div class="subscribe-modal"> <form id="contact" method="post" action=""> <fieldset> <h3>मेरे न्यूज़लेटर की सदस्यता लें</h3> <input name="email" id="email" type="email" placeholder="यहाँ अपना ईमेल पता दर्ज करें" required /> <input type="submit" name="submit" class="submit" value="सदस्यता लें!" /> </fieldset> </form> </div>

<div> टैग कंटेनर एलिमेंट्स को परिभाषित करने के लिए उपयोग किए जाने वाले कई HTML टैग्स में से एक है। कुछ सबसे अधिक उपयोग किए जाने वाले HTML कंटेनर एलिमेंट्स हैं:

<article>,<section>, <main> , <header>, <footer>,<form>।

यदि उपरोक्त कोई भी एलिमेंट आपके कंटेंट के लिए कंटेनर के रूप में उपयोग करने के लिए समझ में आता है, तो जेनेरिक <div> के बजाय उनका उपयोग करें।

क्यों? क्योंकि वे सभी सिमेंटिक एलिमेंट टैग्स हैं जबकि <div> एक अन-सिमेंटिक टैग है, जो कोई विशिष्ट संदर्भ प्रदान नहीं करता।

<div> एलिमेंट के बारे में जानने योग्य बातें

आप <div> एलिमेंट के अंदर किसी भी प्रकार का कंटेंट डाल सकते हैं।

हालांकि सिमेंटिक मार्कअप आम तौर पर अनुशंसित है, लेकिन ब्राउज़र्स के लिए आपके पेज को समझना और यूजर को रेंडर करना आवश्यक नहीं है।

हालांकि, यदि आप उन स्थितियों में जेनेरिक/अन-सिमेंटिक HTML एलिमेंट्स का उपयोग करते हैं जहां HTML में पहले से ही आपके उपयोग के लिए सिमेंटिक टैग्स हैं, तो यह आपके SEO को नुकसान पहुंचा सकता है।

आम तौर पर, मैं <div> एलिमेंट का उपयोग करूंगा यदि मुझे यकीन नहीं था कि किस HTML एलिमेंट का उपयोग करना है क्योंकि मैं गलत एलिमेंट के बजाय एक जेनेरिक एलिमेंट का उपयोग करना पसंद करूंगा। इसके अलावा, तकनीकी दृष्टिकोण से आप <div> एलिमेंट का वास्तव में गलत उपयोग नहीं कर सकते — केवल सिमेंटिक दृष्टिकोण से।

  1. HTML <title> एलिमेंट का उपयोग कैसे करें HTML <title> एलिमेंट का उपयोग कैसे करें

    HTML <title> एलिमेंट का उपयोग करना सीखें। HTML <title> एलिमेंट आपकी वेबसाइट के पेज शीर्षक को दर्शाता है। किसी भी वेबसाइट का पेज शीर्षक देखने के लिए जिस पर आप हैं, अपने माउस को ब्राउज़र पेज टैब पर ले जाएं और कुछ सेकंड के लिए उस पर होल्ड करें, फिर आपको पूरा पेज शीर्षक पॉप अप दिखाई देगा। यह

  1. HTML में रिक्वायर्ड एट्रिब्यूट का उपयोग कैसे करें? HTML में रिक्वायर्ड एट्रिब्यूट का उपयोग कैसे करें?

    HTML में required एट्रिब्यूट का उपयोग यह निर्दिष्ट करने के लिए किया जाता है कि फॉर्म सबमिट होने से पहले एलिमेंट भरा जाना चाहिए। यदि फ़ील्ड भरा नहीं है और सबमिट बटन क्लिक किया जाता है, तो एक त्रुटि उत्पन्न होती है, जो फॉर्म सबमिशन को विफल कर देती है। त्रुटि होगी: कृपया इस फ़ील्ड को भरें।required एट्र

  1. HTML में तत्व का मान कैसे जोड़ें? HTML में तत्व का मान कैसे जोड़ें?

    value एट्रिब्यूट value एट्रिब्यूट HTML में विभिन्न फॉर्म तत्वों का प्रारंभिक या वर्तमान मान निर्दिष्ट करता है। यह निम्नलिखित तत्वों के साथ काम करता है: <button>, <input>, <li>, <option>, <meter>, <progress>, <param>। तत्व-वार उपयोग 1. <input> तत्व &