Skrivanje veze sa CSS-om može se izvršiti na više načina, ali ćemo pogledati dvije metode u kojima URL može biti potpuno sakriven od pogleda. Ako želite da kreirate lov na čuvare ili uskršnje jaje na vašoj web lokaciji, ovo je zanimljiv način sakrivanja veza.
Prvi način je korištenje "none" kao vrijednost vrijednosti CSS vrijednosti pointera. Druga je jednostavno bojiti tekst da odgovara pozadini stranice.
Imajte na umu da nijedan metod neće učiniti da link potpuno nestane iz traženja izvornog koda. Međutim, posjetioci neće imati jednostavan, direktan način da ga vide, a vaši posetioci novinara neće imati pojma kako pronaći link.
Napomena: Ako tražite uputstva o povezivanju spoljašnjeg stila, ova uputstva nisu ono što tražite. Pogledajte kakav spoljni stil list? umjesto toga.
Onemogući događaj pokazivača
Prvi metod koji možemo iskoristiti da sakrijemo URL je da veza ne učini ništa. Kada miš prelazi preko veze, neće vam pokazati na šta ukazuje URL i neće vam dozvoliti da kliknete na njega.
Napišite HTML ispravno
Jedna web stranica, pobrinite se da se hipervezica čita ovako:
ThoughtCo.comNaravno, "https://www.thoughtco.com/" treba da ukazuje na stvarni URL koji želite skrivati , a ThoughtCo.com može biti promenjen na bilo koju riječ ili frazu koja vam se sviđa, a koja opisuje vezu.
Ideja je da će aktivna klasa biti korištena sa CSS ispod kako bi se sakrivala veza.
Koristite ovaj CSS kod
CSS kôd mora da odgovori na aktivnu klasu i objasni pregledaču da bi događaj na kliku veze trebalo da bude "nijedan", ovako:
.aktivni {pointer-događaji: nema; kursor: podrazumevano; }Ovu metodu možete videti u JSFiddle-u. Ako uklonite CSS kod tamo, a zatim ponovo pokrenete podatke, veza iznenada postaje mogućnost klizanja i upotrebe. To je zato što kada CSS nije primenjen, veza se ponaša normalno.
Napomena: Zapamtite da ako korisnik pregleda izvorni kod stranice, videće link i tačno znati gdje to ide, jer kao što smo već vidjeli, kôd je još uvijek tu, on jednostavno nije upotrebljiv.
Promenite Boja veze
Normalno, web dizajner će učiniti hiperveze drugačijom bojom od pozadine, tako da ih posetioci mogu zapravo videti i znati gde idu. Međutim, mi smo tu da sakrivamo veze , pa da vidimo kako promijeniti boju koja odgovara onoj stranici.
Definišite prilagođenu klasu
Ako koristimo isti primjer iz prve metode iznad, možemo jednostavno promijeniti klase na ono što želimo, tako da su samo posebne veze skrivene.
Ako nismo koristili klasu i umjesto toga primijenili CSS odozdo na svaku vezu, onda će svi oni nestati. To nije ono što smo ovde, zato ćemo koristiti ovaj HTML kod koji koristi prilagođenu hideme klasu:
ThoughtCo.comSaznajte koja boja treba koristiti
Pre nego što unesemo odgovarajući CSS kôd da sakrijemo vezu, moramo shvatiti koju boju želimo da koristimo. Ako već imate solidnu pozadinu, kao bela ili crna, onda je to lako. Međutim, i druge specijalne boje moraju biti tačne.
Na primjer, ako vaša boja pozadine ima hex vrijednost e6ded1 , morate znati da CSS kôd radi ispravno za stranicu na koju želite da nestane.
Na raspolaganju vam je puno ovih alata za izbor boja "ili" eyedropper ", od kojih se jedan naziva ColorPick Eyedropper za Chrome pregledač. Koristite ga da biste uzorkovali boju pozadine vaše web stranice da biste dobili heksadecimalnu boju.
Prilagodite CSS da biste promenili boju
Sada kada imate boju koja treba da bude veza, vreme je da to koristite i vrednost prilagođene klase iznad, da biste napisali CSS kod:
.hideme {color: # e6ded1; }Ako je boja pozadine jednostavna kao bela ili zelena, ne morate staviti # znak prije njega:
.hideme {boja: bijela; }Pogledajte kod ovog uzorka u ovom JSFiddle.