साइट अपने आप के लिए एक क्षैतिज मेनू

क्षैतिज मेनू लगभग किसी भी साइट है - यह एक महत्वपूर्ण हिस्सा है के रूप में यह अपनी उपस्थिति और प्रयोज्य को आकर्षित करने या, इसके विपरीत, दूर आगंतुकों को डराने के साथ कर सकते हैं। के जानने के एक प्राथमिक क्षैतिज मेनू बनाने के लिए कैसे करते हैं: बनाने की बुनियादी कौशल में महारत हासिल करने के लिए HTML करने के लिए यह "कंकाल" करते हैं। आप निश्चित रूप से एक तैयार मेनू पा सकते हैं, लेकिन बहुत अच्छा है कि यह कैसे अपने आप को विकसित करने के लिए सीखने के लिए। यह बहुत मजेदार है।

मेनू बनाने के लिए जानें

हम अर्थ विज्ञान है, जो लेआउट के अग्रणी आंकड़े का पालन से विचलित करने के लिए नहीं की कोशिश करो। सबसे पहले आप HTML करने के लिए हमारे मेनू के लिए एक "कंकाल" बनाने के लिए, अपने स्वयं के क्षैतिज मेनू बनाने के लिए बुनियादी कौशल सीखने की है। और फिर यह सजाने होगा, स्टाइल शीट का उपयोग कर। हमारे क्षैतिज मेनू 5 आइटम शामिल हैं। पहले आइटम मुखपृष्ठ पर पुनः निर्देशित किया जाएगा। दूसरी बात - "हमारे बारे में"। तीसरा - "हमारे पुरस्कार"। चौथा - "यह मजेदार है।" पांचवें - "हमसे संपर्क करें"।

एचटीएमएल कोड इस तरह दिखता है:

कौन नहीं जानता है: उल टैग के लिए प्रयोग किया जाता है गोली, उसके तत्वों ली के साथ शुरू करते हैं। ली टैग शैलियों कि उल पर लागू होते हैं वारिस।

उल - सूची के ब्लॉक तत्व है, यह चौड़ाई को बढ़ाया दिया जाएगा। ली भी एक ब्लॉक है।

तो, एक index.html पैदा करते हैं। हम अपने कोड इकट्ठा। इस बिंदु पर, ब्राउज़र बल्कि एक क्षैतिज मेनू से एक ऊर्ध्वाधर प्रदर्शित करता है। लेकिन हम आप लक्ष्य के साथ - साइट के लिए एक क्षैतिज मेनू बनाने के लिए। इसके लिए हमें सीएसएस की जरूरत है।

सीएसएस क्या है?

यदि आपने अभी तक साइटों के विकास में महारत हासिल करने है, तो यह व्यापक स्टाइल शीट्स की अवधारणा से परिचित हो के लिए आवश्यक है। वास्तव में, इन प्रारूपण, प्रसंस्करण के लिए नियम है, जो एक वेब साइट के पृष्ठों पर विभिन्न तत्वों पर लागू होती हैं। हम मानक HTML में तत्वों के गुणों का वर्णन हैं, तो आप आप कोड का एक ही टुकड़े की एक दोहराव मिलता है, यह कई बार दोहराने के लिए होगा। उपयोगकर्ता के कंप्यूटर पर पृष्ठ लोड समय बढ़ेगा। इससे बचने के लिए, वहाँ एक सीएसएस है। यह केवल एक बार एक निश्चित तत्व का वर्णन करने के पर्याप्त होता है, और फिर बस जहां एक विशेष शैली के गुणों का उपयोग करने के संकेत देते हैं। यह न केवल स्वयं पृष्ठ का पाठ, लेकिन यह भी एक और फ़ाइल में का वर्णन करना संभव है। इस साइट के सभी पृष्ठों पर अलग अलग शैलियों का वर्णन लागू करने के लिए अनुमति देगा। यह भी कुछ पृष्ठों को संशोधित करने के सीएसएस फ़ाइल को संशोधित करने के लिए सुविधाजनक है। स्टाइल शीट आप HTML तुलना में एक बेहतर स्तर पर फ़ॉन्ट के साथ काम करने के लिए, साइट के ग्राफिक्स पृष्ठों बिगड़ती से बचने में मदद देते हैं।

मेनू के विकास के लिए स्टाइल शीट का उपयोग करना

मेनू के लिए सीएसएस-कोड:

1. # My_1menu {सूची शैली: कोई नहीं; गद्दी: 6; चौड़ाई: 800px; मार्जिन: ऑटो;}
2. # My_1menu li {फ्लोट: छोड़ा; फ़ॉन्ट: इटैलिक 18px एरियल;}
3. एक {रंग # My_1menu: # 756; प्रदर्शन: ब्लॉक; ऊँचाई: 55px; line-height: 55px; गद्दी: 0px 15px 0px 15px; पृष्ठभूमि: #dfc; text-decoration: कोई नहीं;}
4. # My_1menu एक: मंडराना {रंग: #foa; पृष्ठभूमि: # 788;}

अब चलो जिसके परिणामस्वरूप क्षैतिज सीएसएस मेनू को देखो।

- अंक निर्धारित आइटम्स द्वारा छोड़ा दूर करने के लिए इस आदेश का कोई भी: - # My_1menu तो वहाँ आईडी = my_1menu, सूची शैली के साथ उल तत्व के लिए शैली काम है।

चौड़ाई: 800px - हमारे मेनू की चौड़ाई 800 पिक्सल है।

गद्दी: 0 - इस के अंदर गद्दी निकाल देता है।

मार्जिन: ऑटो - हमारे पेज के केंद्र में क्षैतिज मेनू vyravnivnie।

# My_1menu ली - बताए शैलियों ली-तत्वों।

ऊँचाई: 55px - मेनू ऊंचाई।

# एक My_1menu: मंडराना - बताए तत्व को शैलियों और जब यह प्रेरित है माउस।

हम विस्तार से, हर पंक्ति का वर्णन नहीं होगा के रूप में हर डेवलपर इसके मापदंडों यहाँ निर्दिष्ट कर सकते हैं। वेबसाइट पर मेनू में शैलियों के उपयोग के लिए यह आधार। आप इसे एक अधिक समाप्त और सुंदर उपस्थिति चित्रों का उपयोग कर दे सकते हैं। तत्व निरुपित लेकिन उदाहरण के लिए, पृष्ठभूमि के लिए,: यूआरएल (img1.png) दोहराने-x। वहाँ चलो हो पृष्ठभूमि: यूआरएल (img2.png) दोहराने-x के लिए एक: मंडराना।

अपनी कल्पना, रचनात्मक प्राथमिकताओं का उपयोग करें। तो फिर कैसे वेबसाइट पर एक सरल मेनू बनाने के लिए पर है कि ज्ञान के आधार पर, आप अपनी अनूठी डिजाइन के साथ एक पेज विकसित कर सकते हैं।