CSS ഉപയോഗിച്ച് ലിങ്ക് മറയ്ക്കാൻ നിരവധി മാർഗങ്ങളുണ്ട്, എന്നാൽ ഒരു കാഴ്ച പൂർണ്ണമായും മറയ്ക്കാൻ സാധിക്കുന്ന രണ്ട് രീതികൾ ഞങ്ങൾ പരിശോധിക്കും. നിങ്ങളുടെ സൈറ്റിലെ ഒരു സ്കാവെൻ ഹണ്ട് അല്ലെങ്കിൽ ഈസ്റ്റർ മുട്ട ഉണ്ടാക്കുകയാണെങ്കിൽ, ഇത് ലിങ്കുകൾ മറയ്ക്കാൻ രസകരമായ ഒരു മാർഗമാണ്.
ആദ്യത്തേത് "none" ഉപയോഗിച്ച് പോയിന്റർ-ഇവന്റുകൾ CSS പ്രോപ്പർട്ടീസ് മൂല്യമായി ഉപയോഗിക്കുന്നു. മറ്റൊന്ന്, പേജിന്റെ പശ്ചാത്തലവുമായി പൊരുത്തപ്പെടുത്തുന്നതിനുള്ള വാചകം മാത്രം ഉപയോഗിക്കുക.
സ്രോതസ് കോഡ് തിരയുമ്പോൾ ഈ രീതി കണ്ടെത്താത്തതിൽ നിന്നും പൂർണ്ണമായും അപ്രത്യക്ഷമാകും എന്ന് ഓർമ്മിക്കുക. എന്നിരുന്നാലും, സന്ദർശകർക്ക് ഇത് കാണാൻ ലളിതമായ, നേരിട്ട് വഴിയില്ല, കൂടാതെ നിങ്ങളുടെ നോവീസ് സന്ദർശകർക്ക് ലിങ്ക് കണ്ടെത്താൻ എങ്ങനെ ഒരു സൂചന ഉണ്ടായിരിക്കുകയില്ല.
ശ്രദ്ധിക്കുക: ഒരു ബാഹ്യ സ്റ്റൈൽ ഷീറ്റ് ലിങ്ക് ചെയ്യുന്നതിനുള്ള നിർദ്ദേശങ്ങൾ നിങ്ങൾ തിരയുന്നുണ്ടെങ്കിൽ, ഈ നിർദേശങ്ങൾ നിങ്ങൾ തുടർന്ന് ആയിരിക്കണമെന്നല്ല. എന്താണ് ബാഹ്യ സംവിധാന ഷീറ്റ്? പകരം.
പോയിന്റർ ഇവന്റ് പ്രവർത്തനരഹിതമാക്കുക
ഒരു URL മറയ്ക്കാൻ നമുക്ക് ഉപയോഗിക്കാൻ കഴിയുന്ന ആദ്യ രീതി, ലിങ്ക് പ്രവർത്തിക്കുന്നില്ല. മൗസ് കണ്ണിലൂടെ ഹോളിവുചെയ്തിരിക്കുമ്പോൾ, അത് URL പോയിന്റ് ചെയ്യുന്നതിനെ കാണിക്കില്ല, അത് നിങ്ങൾ ക്ലിക്കുചെയ്യാൻ അനുവദിക്കില്ല.
ശരിയായ രീതിയിൽ HTML എഴുതുക
വെബ്പേജ് ഒന്ന്, ഹൈപ്പർലിങ്ക് ഇങ്ങനെ വായിച്ചുവെന്ന് ഉറപ്പാക്കുക:
ThoughtCo.comതീർച്ചയായും, "https://www.thoughtco.com/" എന്നത് നിങ്ങൾ മറയ്ക്കാൻ ആഗ്രഹിക്കുന്ന യഥാർത്ഥ URL ലേക്ക് ചൂണ്ടിക്കാണിക്കുകയും, ThoughtCo.com നിങ്ങൾക്ക് ലിങ്ക് വിവരിക്കുന്ന ഏതെങ്കിലും വാക്കോ വാചകമോ ആയി മാറ്റാൻ കഴിയും.
ഇവിടെയുള്ള ആശയങ്ങൾ, ഫലപ്രദമായി ലിങ്ക് മറയ്ക്കാൻ ചുവടെയുള്ള CSS ഉപയോഗിച്ച് ക്ലാസ് സജീവമായിരിക്കും.
ഈ CSS കോഡ് ഉപയോഗിക്കുക
CSS കോഡിനെ സജീവ വർഗ്ഗത്തെ അഭിമുഖീകരിക്കാനും ബ്രൌസറോട് വിശദീകരിക്കേണ്ടതുമാണ്. ഈ ലിങ്കിൽ ക്ലിക്ക് ചെയ്തവർ ഇതിനെ "ഒന്നുമില്ല" എന്നാക്കിയിരിക്കണം.
.active {പോയിന്റർ-ഇവന്റുകൾ: ഒന്നുമില്ല; കർസർ: സ്ഥിരസ്ഥിതി; }JSFiddle ൽ നിങ്ങൾക്ക് ഈ രീതി പ്രവർത്തിക്കാൻ കഴിയും. നിങ്ങൾ അവിടെ സിഎസ്എസ് കോഡ് നീക്കം ചെയ്യുകയാണെങ്കിൽ, ഡാറ്റ വീണ്ടും പ്രവർത്തിപ്പിക്കുകയാണെങ്കിൽ, ലിങ്ക് അപ്രതീക്ഷിതമായി ക്ലിക്കുചെയ്യാവുന്നതും ഉപയോഗിക്കാവുന്നതുമാണ്. കാരണം CSS ഉപയോഗിക്കുന്നതല്ലെങ്കിൽ, ലിങ്ക് സാധാരണയായി പ്രവർത്തിക്കുന്നു.
ശ്രദ്ധിക്കുക: ഉപയോക്താവ് പേജ് ഉറവിട കോഡ് കണ്ടാൽ, അവർ ലിങ്ക് കാണുകയും അവ എവിടെയാണെന്ന് കൃത്യമായി മനസ്സിലാക്കുകയും ചെയ്തേക്കാം, കാരണം ഞങ്ങൾ മുകളിൽ കാണുന്നത് പോലെ കോഡ് ഇപ്പോഴും അവിടെയുണ്ടായിരുന്നില്ല, അത് ഉപയോഗയോഗ്യമല്ല.
ലിങ്ക് & # 39; ന്റെ നിറം മാറ്റുക
സാധാരണയായി, ഒരു വെബ് ഡിസൈനർ പശ്ചാത്തലത്തേക്കാൾ ഹൈപ്പർലിങ്കുകൾ വ്യത്യസ്ത വർണ്ണമാക്കും, അതിനാൽ സന്ദർശകർ യഥാർത്ഥത്തിൽ അവരെ കാണാനും അവർ എവിടെയാണ് പോകുന്നതെന്ന് മനസ്സിലാക്കാനും കഴിയും. എന്നിരുന്നാലും, ലിങ്കുകൾ മറയ്ക്കാൻ ഞങ്ങൾ ഇവിടെയുണ്ട്, അതുകൊണ്ട് പേജിന്റെ പൊരുത്തത്തോട് എങ്ങനെ നിറം മാറ്റാം എന്ന് നമുക്ക് നോക്കാം.
ഒരു ഇഷ്ടാനുസൃത വർഗം നിർവ്വചിക്കുക
മുകളിലുള്ള ആദ്യ രീതിയിൽ നിന്നും നമ്മൾ ഇതേ ഉദാഹരണം ഉപയോഗിക്കുകയാണെങ്കിൽ, പ്രത്യേക കണ്ണികൾ മാത്രം മറയ്ക്കാൻ ഞങ്ങൾക്കാവശ്യമുള്ള ക്ലാസ് മാറ്റാൻ കഴിയും.
ഞങ്ങൾ ഒരു ക്ലാസ് ഉപയോഗിക്കാതിരിക്കുകയും അത് ചുവടെ നിന്നും ഓരോ ലിങ്കിലേക്കും CSS പ്രയോഗിക്കുകയും ചെയ്തിട്ടുണ്ടെങ്കിൽ, അവയെല്ലാം അപ്രത്യക്ഷമാകും. ഇത് ഞങ്ങൾ ഇവിടെ നിന്ന് അല്ല, അതിനാൽ ഞങ്ങൾ ഈ HTML കോഡ് ഉപയോഗിക്കുന്നത് ഇഷ്ടാനുസൃത ഹൈഡെം ക്ലാസ് ഉപയോഗിക്കുന്നു:
ThoughtCo.comഉപയോഗിക്കേണ്ട നിറം കണ്ടെത്തുക
ലിങ്ക് മറയ്ക്കുന്നതിനായി ഞങ്ങൾ ഉചിതമായ CSS കോഡ് നൽകും മുമ്പ്, നമ്മൾ ഉപയോഗിക്കാൻ ആഗ്രഹിക്കുന്ന നിറം എന്താണെന്ന് കണ്ടുപിടിക്കണം. വെളുത്തതോ കറുത്തതുപോലെയോ നിങ്ങൾക്കൊരു സോളിഡ് പശ്ചാത്തലം ഉണ്ടെങ്കിൽ, അതും എളുപ്പമാണ്. എന്നിരുന്നാലും, മറ്റ് സവിശേഷ വർണങ്ങളും കൃത്യമായിരിക്കണം.
ഉദാഹരണത്തിന്, നിങ്ങളുടെ പശ്ചാത്തല വർണ്ണത്തിൽ e6ded1 ന്റെ ഒരു ഹെക്സ് മൂല്യം ഉണ്ടെങ്കിൽ , നിങ്ങൾക്ക് സി.എസ്.എസ്. കോഡ് നിങ്ങൾ ശരിയായി പ്രവർത്തിക്കാൻ ആഗ്രഹിക്കുന്ന പേജിൽ ശരിയായി പ്രവർത്തിക്കുമെന്ന് നിങ്ങൾ അറിഞ്ഞിരിക്കണം.
ലഭ്യമായ ഈ "കളർ പിക്കർ" അല്ലെങ്കിൽ "കണ്ണടച്ച്" ടൂളുകൾ ധാരാളം ഉണ്ട്, അതിൽ ഒന്ന് Chrome ബ്രൗസറിനായുള്ള ColorPick ഐഡ്രോപ്പർ എന്നറിയപ്പെടുന്നു. ഹെക്സ് നിറം ലഭിക്കുന്നതിന് നിങ്ങളുടെ വെബ്പേജിന്റെ പശ്ചാത്തല വർണ്ണം മാതൃകപ്പെടുത്താൻ ഇത് ഉപയോഗിക്കുക.
നിറം മാറ്റുന്നതിന് CSS ഇഷ്ടാനുസൃതമാക്കുക
ഇപ്പോൾ നിങ്ങൾക്കാവശ്യമുള്ള നിറം ഉണ്ടായിരിക്കണം, അതുപയോഗിച്ച് ഇഷ്ടാനുസൃത വർഗ മൂല്യം മുകളിൽ നിന്നും, CSS കോഡ് എഴുതാൻ സമയമായി:
.hideme {color: # e6ded1; }നിങ്ങളുടെ പശ്ചാത്തല വർണ്ണം വെളുത്തതോ പച്ചയോ പോലെ ലളിതമാണെങ്കിൽ, നിങ്ങൾ ഇതിന് മുമ്പ് # അടയാളം നൽകേണ്ടതില്ല:
.hideme {വർണ്ണം: വെളുത്ത; }JSFiddle ൽ ഈ രീതിയുടെ മാതൃക കോഡ് കാണുക.