Fshehja e një lidhjeje me CSS mund të bëhet në një numër mënyrash, por do të shohim dy metoda në të cilat një URL mund të fshihet krejtësisht nga pamja. Nëse doni të krijoni një gjueti pastrues ose vezë të pashkëve në faqen tuaj, kjo është një mënyrë interesante për të fshehur lidhjet.
Mënyra e parë është duke përdorur "asnjë" si vlerën e vlerës CSS të treguesve të ngjarjeve. Tjetër është thjesht duke ngjyrosur tekstin që të përputhet me sfondin e faqes.
Mbani në mend se asnjë metodë nuk do ta zhdukë plotësisht lidhjen nga gjetja kur të kërkoni kodin burimor. Sidoqoftë, vizitorët nuk do të kenë një mënyrë të thjeshtë dhe të drejtpërdrejtë për të parë atë, dhe vizitorët tuaj të rishtar nuk do të kenë një ide se si ta gjejnë lidhjen.
Shënim: Nëse po kërkoni udhëzime se si të lidhni një fletë të stilit të jashtëm, këto udhëzime nuk janë ato që ju jeni pas. Shikoni Çfarë fletësh të jashtme të stilit? në vend të kësaj.
Çaktivizo ngjarjen e treguesit
Metoda e parë që mund të përdorim për të fshehur një URL është që lidhja të mos bëjë asgjë. Kur miu rri pezull mbi lidhjen, nuk do të tregojë se çfarë tregon URL dhe nuk do t'ju lejojë të klikoni.
Shkruani HTML në mënyrë korrekte
Një web faqe, sigurohuni që hyperlink lexon kështu:
ThoughtCo.comNatyrisht, "https://www.thoughtco.com/" duhet të tregojë URL-në aktuale që dëshironi fshehur, dhe ThoughtCo.com mund të ndryshohet në çdo fjalë ose shprehje që ju pëlqen që përshkruan lidhjen.
Ideja këtu është se klasa aktive do të përdoret me CSS më poshtë për të fshehur efektivisht lidhjen.
Përdorni këtë kod CSS
Kodi CSS duhet të adresojë klasën aktive dhe të shpjegojë në shfletuesin se ngjarja në klik të lidhjes duhet të jetë "asnjë", si kjo:
.aktiv {tregues ngjarjesh: asnjë; kursori: default; }Ju mund të shihni këtë metodë në veprim gjatë në JSFiddle. Nëse hiqni kodin CSS atje dhe pastaj përsërisni të dhënat, lidhja befas bëhet e klikueshme dhe e përdorshme. Kjo ndodh sepse kur CSS nuk zbatohet, lidhja sillet normalisht.
Shënim: Mos harroni se nëse përdoruesi e sheh kodin burimor të faqes, ata do të shohin lidhjen dhe do të dinë saktësisht se ku shkon, sepse siç e shohim më lart, kodi është ende atje, thjesht nuk mund të përdoret.
Ndrysho Ngjyrën e Lidhjes
Normalisht, një dizajner web do të bëjë hyperlinks një ngjyrë të ndryshme nga sfondi në mënyrë që vizitorët në fakt mund të shohin ato dhe të dinë se ku shkojnë. Megjithatë, ne jemi këtu për të fshehur lidhjet , prandaj të shohim se si ta ndryshojmë ngjyrën që të përputhet me atë të faqes.
Përcaktoni një klasë të personalizuar
Nëse e përdorim të njëjtin shembull nga metoda e parë më lart, ne thjesht mund ta ndryshojmë klasën në çdo gjë që duam, në mënyrë që të fshehin vetëm lidhjet e veçanta.
Nëse nuk kemi përdorur një klasë dhe në vend të kësaj kemi aplikuar CSS nga poshtë në çdo lidhje, atëherë të gjithë do të zhduken. Kjo nuk është ajo që ne jemi pas këtu, kështu që ne do të përdorim këtë kod HTML që është duke përdorur klasën e zakonshme hideme:
ThoughtCo.comGjeni se çfarë ngjyre duhet të përdorni
Para se të hyjmë në kodin e duhur CSS për të fshehur lidhjen, duhet të kuptojmë se çfarë ngjyra duam ta përdorim. Nëse keni një sfond të fortë tashmë, si të bardhë apo të zi, atëherë kjo është e lehtë. Megjithatë, ngjyrat e tjera të veçanta duhet të jenë të sakta.
Për shembull, nëse ngjyra e sfondit ka një vlerë të saktë të e6ded1 , duhet të dini se për kodin CSS të funksionojë siç duhet për faqen që dëshironi të zhduket.
Ka shumë prej këtyre mjeteve "picker ngjyra" ose "syzeqelëse" në dispozicion, njëra prej të cilave quhet kapëse me ngjyra për shfletuesin Chrome. Përdoreni atë për të mostër ngjyrën e sfondit të faqes suaj për të marrë ngjyrën magjike.
Personalizo CSS për të ndryshuar ngjyrën
Tani që ju keni ngjyrën që lidhja duhet të jetë, është koha për të përdorur atë dhe vlerën e klasës doganore nga lart, për të shkruar kodin CSS:
.hideme {color: # e6ded1; }Nëse ngjyra e sfondit është e thjeshtë si e bardhë ose e gjelbër, nuk duhet të vendosni shenja # para saj:
.hideme {ngjyra: e bardhe; }Shihni kodin e mostrës të këtij metodi në këtë JSFiddle.