ലംബ സി.എസ്.എസ് മെനു: അത് സ്വയം ചെയ്യുന്നത്

ചില വെബ്മാസ്റ്ററിനായുള്ള ഇതിനകം നിലനിൽക്കുന്ന സ്ക്രാച്ച് ലളിതമായ ഘടകങ്ങൾ നിന്ന് വികസ്വര സമയം ചെലവഴിക്കാൻ ആഗ്രഹിക്കുന്നില്ല. അവർ നീണ്ട ഉണ്ടായിരുന്നു എന്നു എന്തെങ്കിലും നിങ്ങളുടെ സ്വകര്യ ഇല്ല ഇല്ല എന്നു വിശ്വസിക്കുന്നു. വാസ്തവത്തിൽ, വെറും HTML, CSS ഹൃദിസ്ഥമാക്കി വായിച്ചു കേള്പ്പിച്ചു, അത് പ്രധാനമാണ് അവരുടെ സൃഷ്ടിയുടെ ഒരു നല്ല ബുദ്ധി ഉണ്ടു സ്വയം ഒരു കാര്യം വരുത്തി. ഈ മെനു ബാധകമാണ്. ഒരു ലംബമായ സി.എസ്.എസ് മെനുകൾ സൃഷ്ടിക്കുക. ഇത് Javascript, jQuery ഉപയോഗം ഇല്ലാതെ, മാത്രം HTML, CSS അടിസ്ഥാനമാക്കി ചെയ്യും. ഓരോ മെനു സൈറ്റിന്റെ താളുകളിൽ നയിക്കുന്ന ലിങ്കുകളുടെ പട്ടിക ആണ്.

അടിസ്ഥാന ഘട്ടങ്ങൾ

ഒരു ലളിതമായ സൃഷ്ടിക്കാൻ ലംബമായ മെനു സിഎസ്എസ്, താഴെ പറയുന്ന രീതികൾ വേണം:

1. ആദ്യം, ലിങ്കുകൾ (കോഡ് എച്ച്ടിഎംഎൽ ഉപയോഗിച്ച്) ഒരു ലിസ്റ്റ് നിർണ്ണയിക്കാൻ, മെനു ആയിരിക്കും ഇതിൽ. അവരെ ഒരു പേര് നൽകുക, ഉദാഹരണത്തിന്, താഴെ പറയുന്നു:

1. ഹോം.
2. ഞങ്ങളുടെ ചരിത്രം.
3. വഴികാട്ടി.
4. സേവനങ്ങൾ.
5. ബന്ധങ്ങൾ.

ഞാന് ഒരു സഹായത്തോടെ ആഗ്രഹിക്കുന്നതിനാൽ 2. അപ്പോൾ കണ്ണികൾ സ്റ്റൈലിംഗ്.

ഞങ്ങൾ എഴുതുന്നു , HTML കോഡ് മ്യ്_വ്മെനു.ഹ്ത്മ്ല് ഫയലിൽ പ്രമാണിച്ചു അത് എങ്ങനെ ബ്രൗസറിൽ കാണുന്നതെങ്ങനെയെന്ന്:

ഇത് നമ്മുടെ മെനു അടിസ്ഥാനത്തിൽ (അസ്ഥികൂടം) ആണ്. # 1, # 2, മുതലായവ റഫറൻസ് വഴി ആയിരിക്കണം. ഒരു ബ്രൌസറിൽ എങ്ങനെ കാണുക. ചിത്രം നിങ്ങളെ ഞാന് പ്രതീക്ഷിക്കുന്നില്ല. ഇപ്പോൾ ഞങ്ങൾ ഒരു പൂർണ്ണമായ ലംബമായ സി.എസ്.എസ് മെനുകൾ ഉണ്ടാക്കുവാൻ, രീതിയിൽ ഘടകങ്ങൾ വിശദീകരിക്കാനുള്ള ആരംഭിക്കണം.

വിവരണം ശൈലികൾ

സൈറ്റിന്റെ ഇത്തരം ഒരു പ്രധാന ഘടകം രൂപം മെച്ചപ്പെടുത്താൻ ആഗ്രഹിക്കുന്ന എല്ലാം വെക്കുന്ന ഒരു ഫയൽ മ്യ്_വ്മെനു.ച്ഷ്, സൃഷ്ടിക്കുക. ഇവിടെ കോഡ്, വെർട്ടിക്കൽ സി.എസ്.എസ് മെനുകൾ റ്റാബില് ചെയ്യുന്ന പരിചയപ്പെടുത്തൽ ആണ്. ഇത് പുതിയ ഫയൽ, തുടർന്ന് ഒരു അടുത്ത് തന്നിരിക്കുന്ന പ്രധാന വരികൾ അർഥം നോക്കി എടുക്കും.

വിശദമായ വിവരണം ഉപയോഗിച്ച സ്റ്റൈൽഷീറ്റ്

ഇപ്പോൾ നമ്മുടെ സിഎസ്എസ് ലംബമായ മെനു വിശദാംശങ്ങൾ പരിഗണിക്കുക:

പട്ടിക-ശൈലി-തരം നിങ്ങൾ മാർക്കറുകളുടെ പട്ടിക നീക്കം അനുവദിക്കുന്നു. മാർജിൻ ആൻഡ് പാഡിംഗ് വരെ "0" ക്രമീകരണം വഴി പട്ടികയിൽ അധിക പാഡിങ് നീക്കം. എച്ച്ടിഎംഎൽ കോഡ് നിന്ന് കാണാൻ കഴിയും പോലെ, നമ്മുടെ മെനു ഒരു ലിസ്റ്റാണ്, ശൈലികൾ സിഎസ്എസ് നിർവചിക്കണം ചെയ്യുന്നു.

ഉൾ # മ്യ്_വ്മെനു - മുഴുവൻ പട്ടികയിൽ മൊത്തത്തിലുള്ള ശൈലി.

ഉൾ # മ്യ്_വ്മെനു Li ഒരു - ടാഗ് ലി തമ്മിലുള്ള ശൈലി ലിങ്കുകൾ.

ഉൾ # മ്യ്_വ്മെനു Li ഒരു: ഹോവർ - ആളുകളുടെ കഴ്സർ കൊണ്ടു വരുമ്പോൾ ഒരു സമയത്ത് മെനു ഇനങ്ങളുടെ പരിഗണനയിലാണ് തരം ഒരു വിവരണം.

ഉൾ # മ്യ്_വ്മെനു ലി ഒരു സ്പാൻ - ടെക്സ്റ്റ് വിവരണം (തലക്കെട്ട് മെനു).

ഫയലുകൾ മ്യ്_വ്മെനു.ച്ഷ് മ്യ്_വ്മെനു.ഹ്ത്മ്ല് ഒരേ ഡയറക്ടറിയിൽ സൂക്ഷിക്കും വേണം ഓർക്കുക. എന്നാൽ, വ്യത്യസ്ത ഫോൾഡറുകളിൽ, എന്നാൽ പിന്നീട് അത് മ്യ്_വ്മെനു.ഹ്ത്മ്ല് ഫയൽ പാത മ്യ്_വ്മെനു.ച്ഷ് ലേക്ക് രജിസ്റ്റർ പ്രധാനമാണ്. കാരണം പലപ്പോഴും ഈ പ്രശ്നം പുതുമുഖങ്ങളെ, ശ്രദ്ധിക്കുക.

സ്റ്റൈൽ ഒരു HTML-ഫയലിൽ തല ടാഗുകൾക്കിടയിൽ കണക്ട് വേണം. മെനു_൧.പ്ന്ഗ് ആൻഡ് മെനു_൨.പ്ന്ഗ് - ഈ സാധാരണ സംസ്ഥാന ഹോവർ ചിത്രം മെനു ഇനത്തിന് ചിത്രമാണ്.

ഇത് ചിത്രങ്ങൾ ഒരു പ്രത്യേക ഫോൾഡറിൽ ചിത്രങ്ങൾ സംരക്ഷിക്കാൻ നല്ലതു, പേര് മ്യ്_ഇമഗെസ് എന്നാൽ സി.എസ്.എസ് കോഡ് ക്രമീകരിക്കുക. ഈ ചിത്രങ്ങൾ കാണിക്കുന്നു എവിടെ എഴുതുക, ഈ ഡയറക്ടറിയിൽ ഉണ്ട്: URL (മ്യ്_ഇമഗെസ് / മെനു_൧.പ്ന്ഗ്), URL (മ്യ്_ഇമഗെസ് / മെനു_൨.പ്ന്ഗ്).

സി.എസ്.എസ് കോഡ് വിവരിച്ചിട്ടുള്ള ഉള്ള ബാക്കി ൽ, എളുപ്പത്തിൽ മനസ്സിലാക്കാൻ. അവർ നമ്മുടെ മെനു രൂപം define. ഇത് ആ സാധാരണ നിലയിലേക്ക് അതേ ഇനങ്ങൾ വേണ്ടി വ്യക്തമാക്കിയ ഇനങ്ങളുടെ വീതിയും ഉയരവും ശ്രദ്ധിച്ചിരുന്നു എളുപ്പമാണ്, നിങ്ങൾ അവരുടെ മേൽ മൌസ് വയ്ക്കുക വരുമ്പോൾ. ഫോണ്ട് വലിപ്പം 18px, പാഡിംഗ് പേരുകൾ വിവിധ വശങ്ങളും നിന്ന് തിരിച്ചറിയൽ വ്യക്തമാക്കുന്നു. ഡിസ്പ്ലേ നിങ്ങൾ വീതിയും പാഡിംഗ് സജ്ജമാക്കാൻ ഡിസ്പ്ലേ യൂണിറ്റ് അനുവദിക്കുന്നു.

നമ്മുടെ ലംബമായ മെനു

എളുപ്പത്തിൽ സൃഷ്ടിക്കാൻ കാണുന്നത് പോലെ, ലംബമായ സി.എസ്.എസ് മെനുകൾ. അറിവിന്റെ ഡാറ്റ അടിസ്ഥാനത്തിൽ അത് മനോഹരമായ നിങ്ങളുടെ വെബ്സൈറ്റ് സന്ദർശിക്കുന്നവരെ ലേക്ക് ആകർഷകമാക്കുന്നു കഴിയും! നിങ്ങളുടെ സൈറ്റ് യോജിച്ച ഒരു സ്റ്റൈലിഷ് മെനു തുടർന്ന് നിങ്ങളുടെ ഭാവന, ഉം.