தளத்தில் நீங்களே ஒரு கிடைமட்ட மெனு செய்ய

கிடைமட்ட மெனு கிட்டத்தட்ட எந்த தளம் உள்ளது - அது, மாறாக கவருவதில் அல்லது பார்வையாளர்கள் விட்டு பயமுறுத்தும் அதன் தோற்றம் மற்றும் பயன்பாட்டினை கொண்டு முடியும் அது, ஒரு முக்கியமான பகுதியாக உள்ளது. இதோ ஒரு தொடக்க கிடைமட்ட மெனு உருவாக்க எவ்வாறு இணைப்பது என்பதைக் கற்றுக்கொள்வோம்: அது "எலும்புக்கூடு" உருவாக்கும் அடிப்படை திறமைகளை வளர்ப்பது, HTML -க்கு செய்ய. நீங்கள் நிச்சயமாக ஒரு தயாராக மெனு காணலாம், ஆனால் அது உங்களை உருவாக்க கற்றுக்கொள்ள மிகவும் இனிமையானதுமாகும். அது அழகான வேடிக்கையானது.

மெனு செய்ய அறிய

நாம் அமைப்பை முன்னணி பிரமுகர்கள் கடைபிடிக்கின்றன எந்த பொருள்கள், இருந்து பின்வாங்க கூடாது முயற்சி. முதலில் நீங்கள், ஒரு HTML எங்கள் மெனுக்களை க்கான "எலும்புக்கூடு" செய்ய தங்கள் சொந்த கிடைமட்ட மெனுக்கள் செய்ய அடிப்படை திறன்களை கற்றுக்கொள்ள வேண்டும். பின்னர் அது பாணி தாள்கள் பயன்படுத்தி, அலங்கரிக்க வேண்டும். எங்கள் கிடைமட்ட மெனு 5 உருப்படிகள் உள்ளன பார்ப்போம். முதல் உருப்படியை முகப்பு திருப்பி விடப்படுவார்கள். இரண்டாவது புள்ளி - "எங்களை பற்றி". மூன்றாம் - 'எங்கள் விருதுகளில் ". நான்காம் - "இது வேடிக்கையானது." ஐந்தாவது - "எங்களை தொடர்பு".

HTML ஐ குறியீடு இந்த தெரிகிறது:

இல்லை தெரியாது யார்: உல் டேக் பயன்படுத்தப்படுகிறது புல்லட், அதன் கூறுகள் லி தொடங்கும். லி குறிச்சொற்களை உல் பயன்படுத்தப்படும் என்று பாணியை மரபுரிமையாக.

உல் - பட்டியலில் தொகுதி உறுப்பு, அது அகலத்திற்கு நீட்டி. லி ஒரு சாதனமாகவும் இருக்கிறது.

எனவே, ஒரு இன்டெக்ஸ்.ஹெச்டிஎம்எல் உருவாக்க. நாங்கள் எங்கள் குறியீடு சேகரிக்க. இந்த கட்டத்தில், உலாவி மாறாக ஒரு கிடைமட்ட மெனு விட செங்குத்து காட்டுகிறது. ஆனால் நீங்கள் குறிக்கோளுடன் நாம் - தளத்தில் ஒரு கிடைமட்ட மெனு செய்ய. இதற்காக நாம் CSS வேண்டும்.

CSS ஐ என்ன?

நீங்கள் தளங்கள் வளர்ச்சி மாஸ்டர் இன்னும் இருந்தால், அதை அடுக்கு நடைத்தாள்கள் கருத்து பழக்கப்படுத்திக்கொள்ள வேண்டும். உண்மையில், இந்த ஒரு இணைய தளத்திற்கு பக்கங்களில் பல்வேறு உறுப்புகள் பயன்படுத்தப்படும் எந்தெந்த வடிவமைத்தல், செயலாக்க விதிகள் உள்ளன. நாங்கள் தரமானது HTML உறுப்புகளை பண்புகள் விவரிக்க என்றால், நீங்கள் குறியீட்டை அதே துண்டுகள் ஒரு பிரதி கிடைக்கும், இந்த பல முறை மீண்டும் வேண்டும். பயனரின் கணினியில் பக்கம் சுமை நேரம் வளரும். இதை தவிர்க்க, ஒரு CSS உள்ளது. அது ஒரு குறிப்பிட்ட உறுப்பு ஒரு முறை மட்டுமே விவரிக்க போதுமானதாக, பின்னர் வெறுமனே அங்கு ஒரு குறிப்பிட்ட பாணி பண்புகள் பயன்படுத்த குறிப்பிடுகின்றன. அது பக்கம் தன்னை மட்டுமே உரை, ஆனால் மற்றொரு கோப்பில் விளக்கம் செய்ய முடியும். இத்தளம் அனைத்து பக்கங்களுக்கு வெவ்வேறு வடிவங்களில் விளக்கம் விண்ணப்பிக்க அனுமதிக்கும். இது CSS கோப்பு மாற்றும், சில பக்கங்கள் மாற்ற மேலும் வசதியாக உள்ளது. பாணி தாள்கள் நீங்கள் தளத்தின் கிராபிக்ஸ் பக்கங்களில் மோசமான தவிர்க்க உதவி, HTML ஐ விட ஒரு நல்ல அளவில் எழுத்துருக்கள் செயல்பட அனுமதிக்க.

மெனு வளர்ச்சிக்கு நடைத்தாள்கள் பயன்படுத்தி

மெனு CSS ஐ குறியீடு:

1. # My_1menu {பட்டியலில் பாணி: யாரும்; திணிப்பு: 6; அகலம்: 800px; விளிம்பு: கார்;}
2. # My_1menu லி {மிதவை: left; எழுத்துரு: சாய்வு 18px ஏரியல்;}
3. # My_1menu ஒரு {நிறம்: # 756; காட்சி: தொகுதி; உயரம்: 55px; வரிசை உயரம்: 55px; திணிப்பு: 0px 15px 0px 15px; பின்னணி: #dfc; உரை அலங்காரம்: யாரும்;}
4. # My_1menu ஒரு: மிதவை {நிறம்: #foa; பின்னணி: # 788;}

இப்போது விளைவான கிடைமட்ட CSS மெனு பார்போம்.

- திட்டமிடப்பட்டுள்ளது பொருட்களை விட்டு மதிப்பெண்கள் நீக்க இந்த கட்டளை இன்றி: - # My_1menu அங்கு ஐடி = my_1menu, பட்டியலில் பாணியில் UL- உறுப்பு ஆகியவற்றிற்காக நடை வேலையை ஆகிறது.

அகலம்: 800px - எங்கள் மெனு அகலம் 800 பிக்சல்கள்.

திணிப்பு: 0 - இந்த உள்ளே திணிப்பு நீக்குகிறது.

விளிம்பு: கார் - எங்கள் பக்கம் மையத்தில் கிடைமட்ட மெனு vyravnivnie.

# My_1menu லி - பாணியை லி-உறுப்புகள் ஒதுக்க.

உயரம்: 55px - பட்டி உயரம்.

# My_1menu ஒரு: மிதவை - உறுப்பு ஸ்டைல்கள் ஒதுக்க மற்றும் அது தூண்டப்படுகிறது போது சுட்டி.

நாம் ஒவ்வொரு மேம்பாட்டாளர் இங்கே அதன் பாராமீட்டர்களுடைய குறிப்பிட முடியும் என, விரிவாக ஒவ்வொரு வரி விவரிக்க முடியாது. வலைத்தளத்தில் மெனுவில் பாணியை பயன்படுத்தி இந்த அடிப்படையில். நீங்கள் படங்களை பயன்படுத்தி, மிகவும் உறுதியளிக்கப்பட்ட முடிக்கப்பட்ட மற்றும் அழகான தோற்றத்தை கொடுக்க முடியும். உதாரணமாக, பின்னணி உறுப்பு ஒதுக்கு ஆனால்,: இணைய முகவரிக்கு (img1.png) மீண்டும் -x. இருக்க பின்னணி ஏதும் வேண்டாம்: இணைய முகவரிக்கு (img2.png) மீண்டும் மீண்டும்-x ஆனது க்கான: மிதவை.

உங்கள் கற்பனை, படைப்பு விருப்பங்களை பயன்படுத்தவும். பின்னர் வலைத்தளத்தில் ஒரு எளிய மெனு உருவாக்க எப்படி என்று அறிவை அடிப்படையாகக் கொண்டு, நீங்கள் அதன் சொந்த தனிப்பட்ட வடிவமைப்பு ஒரு பக்கம் உருவாக்க முடியும்.