पॉपअप मेनू कैसे बनाएं

विषयसूची:

पॉपअप मेनू कैसे बनाएं
पॉपअप मेनू कैसे बनाएं

वीडियो: पॉपअप मेनू कैसे बनाएं

वीडियो: पॉपअप मेनू कैसे बनाएं
वीडियो: पॉपअप मेनू - एंड्रॉइड स्टूडियो ट्यूटोरियल 2024, नवंबर
Anonim

सक्षम HTML कोड और सरल CSS नियमों की सहायता से, आप एक पॉप-अप मेनू बना सकते हैं, इसे पूरक कर सकते हैं और इसे संशोधित कर सकते हैं। कैस्केडिंग टेबल और मार्कअप भाषा टूल का उपयोग करके, आप यह सुनिश्चित कर सकते हैं कि मेनू स्वयं सभी ब्राउज़रों में सही ढंग से काम करता है।

पॉपअप मेनू कैसे बनाएं
पॉपअप मेनू कैसे बनाएं

अनुदेश

चरण 1

पहले बेसिक मेन्यू बार को होल्ड करें। टेक्स्ट एडिटर में सबमेनू के साथ एक विशेष क्रमांकित सूची बनाएं। आमतौर पर इन उद्देश्यों के लिए "नोटपैड" का उपयोग किया जाता है। सबमेनू मूल सूची के एक तत्व के रूप में कार्य करता है। उदाहरण के लिए: पहला ElementFlood ElementFlood Element2Field Element3Field Element4Field Element5

चरण दो

इस सूची को एक अलग html फ़ाइल में सहेजें। फिर एक.css फ़ाइल बनाएँ। सभी आवश्यक स्टाइल शीट पैरामीटर दर्ज करें। इसे बहुत सावधानी से करें, क्योंकि एक गलती, और पॉप-अप मेनू सही ढंग से प्रदर्शित नहीं होगा या बिल्कुल भी काम नहीं करेगा।

चरण 3

बुलेट सूची में लागू किसी भी बुलेट और पैडिंग को हटा दें। CSS टूल का उपयोग करके मेनू की चौड़ाई सेट करें: ul -style: none; चौड़ाई: 200px; }

चरण 4

सूची में सभी वस्तुओं की सापेक्ष स्थिति को स्थिति नामक विशेषता के साथ चिह्नित करें: उल ली: रिश्तेदार; }

चरण 5

फिर सबमेनू व्यवस्थित करें, जिसके तत्व पैरेंट मेनू से दाईं ओर दिखाई देंगे जब माउस कर्सर आइटम के ऊपर होगा: li ul: निरपेक्ष; बाएँ: 199px; शीर्ष: 0; प्रदर्शन: कोई नहीं; }

चरण 6

बाईं विशेषता मेनू की चौड़ाई से एक पिक्सेल कम है। यह पॉप-अप आइटम को डबल बॉर्डर बनाए बिना सही ढंग से स्थित करने की अनुमति देता है। डिस्प्ले एट्रिब्यूट का उपयोग पेज खोलते समय सबमेनू को छिपाने के लिए किया जाता है।

चरण 7

उपयुक्त सीएसएस विकल्पों का उपयोग करके आवश्यकतानुसार लिंक को स्टाइल करें। डिस्प्ले शामिल करें: ब्लॉक पैरामीटर ताकि लिंक उनके लिए आरक्षित सभी जगह ले सकें। जब माउस कर्सर उस पर मँडरा रहा हो तो मेनू प्रकट करने के लिए, निम्नलिखित कोड दर्ज करें: li: hover ul: block; }

चरण 8

सूची आइटम और लिंक को इच्छानुसार प्रदर्शित करने के लिए अतिरिक्त विकल्प सेट करें।.html फ़ाइल में एक विशेषता शामिल करें। पॉप-अप मेनू उपयोग के लिए तैयार है।

सिफारिश की: