HTML में सबसे सरल ड्रॉपडाउन सूची चुनिंदा टैग का उपयोग करके बनाना आसान है। यह एक कंटेनर टैग है, विकल्प टैग इसमें निहित हैं - वे सूची आइटम को परिभाषित करते हैं।
सूचियों के कई विकल्प हैं जो आप कर सकते हैंचयन टैग का उपयोग करें: एक ड्रॉप-डाउन सूची (मुख्य क्षेत्र पर क्लिक करने या उसके ऊपर मँडरा जाने के बाद विकल्प) और एक बहु विकल्प सूची - इसमें उपयोगकर्ता कई वस्तुओं का चयन कर सकता है। पूर्व अधिक सामान्य हैं, वे आधुनिक साइटों के नेविगेशन का एक महत्वपूर्ण तत्व हैं। एकाधिक पसंद ड्रॉप-डाउन सूची का उपयोग किया जा सकता है, उदाहरण के लिए, कैटलॉग में जहां आपको कई उत्पाद विशेषताओं का चयन करने की आवश्यकता होती है।
आप सामान्य और कस्टम विशेषताओं का उपयोग करके सूचियों के स्वरूप और गुणों को बदल सकते हैं।
टैग विशेषताओं का चयन करें
1. एकाधिक: एकाधिक विकल्प सेट करता है।
२।आकार - सूची में दृश्यमान रेखाओं की संख्या निर्धारित करता है, अर्थात् ऊंचाई। और यहाँ यह सब इस बात पर निर्भर करता है कि बहु गुण मौजूद है या नहीं। यदि हां, और आप आकार निर्दिष्ट नहीं करते हैं, तो कई की उपस्थिति में, उपयोगकर्ता को सभी संभावित विकल्प दिखाई देंगे, यदि एकाधिक अनुपस्थित है, तो केवल एक पंक्ति दिखाई जाएगी, और बाकी आगंतुक कब पढ़ पाएंगे वह दाईं ओर लिफ्ट आइकन पर क्लिक करता है। यदि ऊंचाई का आकार निर्दिष्ट है और यह विकल्पों की संख्या से कम है, तो दाईं ओर एक स्क्रॉल पट्टी दिखाई देगी।
3. नाम - नाम। ड्रॉप-डाउन सूची के साथ भेजा जा सकता है, लेकिन सर्वर पर हैंडलर के साथ बातचीत करना आवश्यक हो सकता है। एक नियम के रूप में, नाम अभी भी संकेत दिया गया है।
विकल्प टैग के विपरीत चयन टैग में आवश्यक विशेषताएँ नहीं हैं।
विकल्प नेस्टेड टैग विशेषताएँ
- चयनित - एक सूची आइटम का चयन करने के लिए डिज़ाइन किया गया। यदि एकाधिक विशेषता सेट की जाती है तो उपयोगकर्ता एक से अधिक आइटम का चयन करने में सक्षम होगा (ऊपर देखें)।
- मान - मान। यह विशेषता आवश्यक है। वेब सर्वर को ठीक से समझना चाहिए कि उपयोगकर्ता ने किन सूची आइटमों का चयन किया है।
- लेबल।इस विशेषता का उपयोग उन सूची मदों को छोटा करने के लिए किया जा सकता है जो बहुत लंबे हैं। उदाहरण के लिए, टैग में निर्दिष्ट "मिलान लोम्बार्डी का प्रशासनिक केंद्र है" विकल्प के बजाय "मिलान" प्रदर्शित किया जाएगा। उत्तरी इटली ”। इस विशेषता का उपयोग किसी सूची में आइटमों को समूहीकृत करने के लिए भी किया जाता है।
सूची की चौड़ाई के लिए, यह डिफ़ॉल्ट रूप से सूची में सबसे विस्तृत पाठ की लंबाई के लिए निर्धारित है। बेशक, HTML शैलियों का उपयोग करके चौड़ाई को बदला जा सकता है।
अन्य तरीकों से ड्रॉप-डाउन सूची
यह सीएसएस के साथ किया जा सकता है, उदाहरण के लिएजब आप पृष्ठ तत्व पर होवर करेंगे तो सूची दिखाई देगी। जावास्क्रिप्ट सूची बनाने के लिए उत्कृष्ट विकल्प प्रदान करता है, जिसे जेक्वरी लाइब्रेरी द्वारा सरल किया जाता है। इस लाइब्रेरी से जुड़ी ड्रॉपडाउन सूची बहुत जटिल हो सकती है, उदाहरण के लिए, कैस्केडिंग। यही है, जब आप एक सूची में किसी आइटम का चयन करते हैं, तो निम्न सूची दिखाई देती है, उदाहरण के लिए, एक मेनू आइटम "महिलाओं के कपड़े" (जब आप मँडराते हैं, तो कपड़े के प्रकार निकल जाते हैं), तब जब आप किसी एक प्रकार का चयन करते हैं, तो उदाहरण के लिए, "आउटरवियर", तत्वों के साथ एक सूची: जैकेट, पार्का, कोट, शॉर्ट कोट, फरेट्स, आदि।
हमने सतही तौर पर इसके मुख्य तरीकों को सूचीबद्ध किया हैजिसके साथ आप एक ड्रॉप-डाउन सूची बना सकते हैं। बेशक, HTML, CSS और JavaScript में बहुत सारी बारीकियाँ हैं जो आपको सूचियों की कार्यक्षमता और उपस्थिति बदलने की अनुमति देती हैं।
