தற்போதைய வலை வடிவமைப்பு தரத்தைப் பின்பற்ற CSS மற்றும் HTML இல் 11 வட்ட மெனுக்கள்

CSS ஸ்பின் அவுட்

நாங்கள் இன்னொருவருடன் தொடர்கிறோம் CSS இல் வட்ட மெனுக்களின் பெரிய பட்டியல் HTML ஐப் போலவே, அவற்றை உங்கள் வலைத்தளத் தேவைகளுக்கு ஏற்ப மாற்றிக் கொள்ளலாம். இந்த வட்ட மெனுக்கள் முக்கியமாக அந்த ஹாம்பர்கர் மெனுவை ஒரு பாணியையும், வட்டத்தைச் சுற்றியுள்ள அனிமேஷன்களையும் கொடுக்க முயற்சிக்கின்றன; அது வேறுவிதமாக இருக்க முடியாது போல.

மிகவும் மாறுபட்ட மற்றும் சரியான ஒன்று உள்ளன தேவையான கவனம் செலுத்த முடியும் ஒரு குறிப்பிட்ட கருப்பொருளுக்கு. ஒரு அனிமேஷன் மற்றும் குறைந்தபட்ச காட்சி பாணி பார்வையாளருக்கு சமிக்ஞைகளை வழங்க முடியும், இதன்மூலம் வலை வடிவமைப்பில் எங்கள் வலைத்தள தரத்தை வழங்க எங்களுக்கு நல்ல கண் இருப்பதை அவர்கள் அறிவார்கள். இணைப்பதை முதலில் இழக்காமல், 11 வட்ட மெனுக்கள் மூலம் செய்வோம் CSS மெனுக்களின் மற்றொரு பட்டியலுக்கு.

வட்ட வழிசெலுத்தல் மெனு

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

மிதக்கும் வட்ட மெனு

மிதக்கும் வட்ட மெனு

இந்த வட்ட மிதக்கும் மெனு ஜாவாஸ்கிரிப்ட்டில் மூழ்கியுள்ளது, அத்துடன் HTML மற்றும் CSS. தொடர்ச்சியான அனிமேஷன்களைக் கொண்ட மற்றொரு மெனு இந்த பட்டியலில் சிறந்தவற்றில் இடம்பிடித்தது. எந்த சந்தேகமும் இல்லாமல் தரம்.

வட்ட வழிசெலுத்தல் பட்டி

வட்ட நவ்பார்

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

வட்ட பொருள் மெனு

வட்ட பொருள்

பொருள் வடிவமைப்பிற்கான மற்றொரு வட்ட மெனு மற்றவற்றிலிருந்து தனித்து நிற்கிறது செங்குத்தாக தோன்றும் ஐகான்களின் தொடருக்கு. வேலைநிறுத்தம் மற்றும் சரியான பூச்சுடன்; நேர்த்தியானது அல்ல, ஆனால் அது நன்றாக இருக்கிறது.

வட்ட மெனு

வட்ட மெனு

இந்த மெனுவில் அனிமேஷன் பொருத்தப்பட்டுள்ளது ஹாம்பர்கர் பொத்தானை விரிவாக்கு ஒருங்கிணைந்த இணையதளத்தில் நீங்கள் செல்லக்கூடிய வெவ்வேறு பிரிவுகளைக் காண்பிக்க.

CSS இல் ரேடியல் மெனு

CSS ரேடியல் மெனு

இந்த ரேடியல் மெனு CSS மற்றும் HTML இல் தயாரிக்கப்பட்டுள்ளது. ஒரு மிகவும் காட்சி வட்ட மெனு அந்த தொடர் படங்களுக்கு ஹாம்பர்கர் ஐகானைக் கிளிக் செய்யும் போது தோன்றும். அது அந்த அம்சத்தால் மட்டுமே வேறுபடுகிறது.

ரேடியல் மெனு

வட்ட மெனு

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

பட்டி CSS கூய்

கூய் மெனு

இந்த மெனு அந்த வகை அனிமேஷனுக்குக் கீழ்ப்படிகிறது கூய் என்று அழைக்கப்படுகிறது, இது பல்வேறு பிரிவுகளை உருவாக்குகிறது ஹாம்பர்கர் பொத்தானிலிருந்து பாயும். CSS இல் உள்ள மற்றவற்றிலிருந்து வேறுபட்ட வட்ட மெனு, எனவே அதை இணையதளத்தில் ஒருங்கிணைக்க நீங்கள் தயாராக உள்ளீர்கள். ஒரு துடிப்பான மற்றும் கண்கவர் அனிமேஷன் தான் உண்மையில் கூட்டத்திலிருந்து தனித்து நிற்க வைக்கிறது.

அனிமேஷன் ரேடியல் மெனு

வட்ட ரேடியல்

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

வட்ட வழிசெலுத்தல் பாப்அவுட்

வட்ட பாப்அவுட்

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

வட்ட மெனு சுழற்று

CSS ஸ்பின் அவுட்

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


கட்டுரையின் உள்ளடக்கம் எங்கள் கொள்கைகளை பின்பற்றுகிறது தலையங்க நெறிமுறைகள். பிழையைப் புகாரளிக்க கிளிக் செய்க இங்கே.

ஒரு கருத்து, உங்களுடையதை விட்டு விடுங்கள்

உங்கள் கருத்தை தெரிவிக்கவும்

உங்கள் மின்னஞ்சல் முகவரி வெளியிடப்பட்ட முடியாது.

*

*

  1. தரவுக்கு பொறுப்பு: மிகுவல் ஏஞ்சல் கேடன்
  2. தரவின் நோக்கம்: கட்டுப்பாட்டு ஸ்பேம், கருத்து மேலாண்மை.
  3. சட்டபூர்வமாக்கல்: உங்கள் ஒப்புதல்
  4. தரவின் தொடர்பு: சட்டபூர்வமான கடமையால் தவிர மூன்றாம் தரப்பினருக்கு தரவு தெரிவிக்கப்படாது.
  5. தரவு சேமிப்பு: ஆக்சென்டஸ் நெட்வொர்க்குகள் (EU) வழங்கிய தரவுத்தளம்
  6. உரிமைகள்: எந்த நேரத்திலும் உங்கள் தகவல்களை நீங்கள் கட்டுப்படுத்தலாம், மீட்டெடுக்கலாம் மற்றும் நீக்கலாம்.

  1.   Leandro அவர் கூறினார்

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