Cara Singidaken Tautan Nggunakake CSS

Ndhelik link karo CSS bisa rampung kanthi cara, nanging kita bakal nemokake rong cara sing URL bisa rampung didhelikake saka tampilan. Yen sampeyan pengin nggawe golek scavenger utawa endhog Paskah ing situs sampeyan, iki minangka cara sing menarik kanggo ndhelikake pranala.

Cara pisanan yaiku kanthi nggunakake "none" minangka Nilai Properti CSS pointer-events. Liyane iku kanthi mung nglayang teks supaya cocog karo latar mburi kaca.

Elinga yen ora ana cara nggawe link kasebut ilang saka ditemokake nalika nggoleki kode sumber. Nanging, pengunjung ora bakal duwe cara sing gampang lan langsung, lan pengunjung sing anyar ora bakal nemokake cara kanggo nemokake link kasebut.

Wigati: Yen sampeyan lagi nggoleki instruksi babagan cara nggabungake lembar gaya eksternal, instruksi iki ora kaya apa sing bakal ditindakake. Deleng Apa sawijining Lembar Gaya Eksternal? kanggo ngganti.

Mateni Event Pointer

Metode kapisan sing bisa digunakake kanggo ndhelikake URL yaiku kanggo nggawe link apa-apa. Nalika mouse mlayu liwat link, ora bakal nuduhake URL URL lan ora bakal ngidini sampeyan ngeklik.

Nulisake HTML kanthi bener

Siji kaca web, priksa manawa pranala kasebut kaya iki:

ThoughtCo.com

Mesthine, "https://www.thoughtco.com/" kudu nggawa URL asli sing pengin didhelikake, lan ThoughtCo.com bisa diganti karo tembung utawa tembung sing sampeyan seneng sing nggambarake link.

Ide ing kene yaiku aktif kelas bakal digunakake kanthi CSS ing ngisor iki kanggo ndhelikake pranala kanthi efektif.

Gunakake Kode CSS Iki

Kode CSS mbutuhake alamat kelas aktif lan nerangake menyang browser yen acara kasebut marang klik link, kudu "ora ana," kaya iki:

.aktif {pointer-events: none; kursor: default; }

Sampeyan bisa ndeleng cara iki ing aksi liwat ing JSFiddle. Yen sampeyan mbusak kode CSS kasebut, banjur pindhah data kasebut, pranala kasebut dumadakan bisa diklik lan bisa digunakke. Iki amarga nalika CSS ora diterapake, pranala iki dumadi sacara normal.

Cathetan: Elinga yèn pangguna ndeleng kode sumber kaca kasebut, bakal padha ndeleng pranala kasebut lan ngerti persis ing ngendi amarga amarga kita ndeleng ndhuwur, kodhe isih ana, mung ora bisa digunakake.

Ngganti Link & # 39; s Warna

Biasane, desainer web bakal nggawe hyperlinks warna sing beda saka latar mburi supaya pengunjung bisa ndeleng lan ngerti ngendi dheweke arep. Nanging, kulo nyedhaki ndhelikake pranala , supaya ngati-ati carane ngganti warna supaya cocog karo kaca kasebut.

Netepake Kelas Kustom

Yen kita nggunakake conto sing padha saka cara pisanan ing ndhuwur, kita mung bisa ngganti kelas dadi apa wae sing dikarepake supaya mung pranala khusus sing didhelikake.

Yen kita ora nganggo kelas lan tinimbang nganggo CSS saka ngisor iki kanggo saben pranala, kabeh mau bakal ilang. Sing ora apa sing kita tindakake kene, supaya kita bakal nggunakake kode HTML sing nggunakake kelas hideme adat:

ThoughtCo.com

Temokake Warna Apa Gunakake

Sadurunge kita ngetik kode CSS sing cocok kanggo ndhelikake link, kita kudu mangerteni apa werna sing arep kita gunakake. Yen sampeyan duwe latar sing padhet, kaya putih utawa ireng, banjur iku gampang. Nanging, werna khusus liyane kudu bener banget.

Umpamane, yen werna latar mburi duweni nilai hex e6ded1 , sampeyan kudu ngerti yen kode CSS bisa mlaku kanggo kaca sing sampeyan pengin ilang.

Ana akeh alat "picker warna" utawa "eyedropper" sing kasedhiya, salah siji diarani ColorPick Eyedropper kanggo browser Chrome. Gunakake kanggo nyicipi werna latar mburi kaca web kanggo entuk werna hex.

Ngatur CSS kanggo Ngganti Warna

Saiki yen sampeyan duwe warna sing kudu ditrapake, wektune kanggo nggunakake lan nilai kelas khusus saka ndhuwur, kanggo nulis kode CSS:

.hideme {color: # e6ded1; }

Yen werna latar mburi kaya putih utawa ijo, sampeyan ora kudu masang tanda # sadurunge:

.hideme {color: white; }

Waca kode sampel metode iki ing JSFiddle iki.