Cum să dezactivați o legătură folosind numai CSS

Cum Sa Dezactivati O Legatura Folosind Numai Css



Fiecare site web conține o mulțime de link-uri pe fiecare interfață care direcționează utilizatorul către alte pagini web. De exemplu, link-uri pentru a vizita un alt site web pentru referință în timp ce citiți o postare pe blog, vizitați conturile de rețele sociale ale unei mărci în timp ce vizitați site-urile lor și descărcați software pentru computer etc. Dar, dacă este necesar să dezactivați un link, indicatorul CSS este utilizată proprietatea evenimentului.

Următoarea postare va explica modul în care proprietatea evenimentului pointer este utilizată într-un cod pentru a dezactiva o legătură într-un document HTML.

Dezactivarea unei legături folosind CSS

Biblioteca CSS este folosită în combinație cu alte limbi precum HTML. Deci, dacă un document HTML are un link pentru a vizita direct orice altă pagină web, proprietatea CSS pointer-events este folosită pentru a dezactiva un link:







pointer-evenimente : nici unul ;
cursor : Mod implicit ;

Cum se utilizează proprietatea pointer-events în cod?

Declarația de stil CSS în care vom adăuga proprietatea pointer-events pentru a dezactiva linkul ar trebui să se refere la clasa care conține linkul. De exemplu, dacă avem o clasă numită „neactiv” care conține linkul:



< h1 > Dezactivați legătura folosind CSS < / h1 >< br >
< b > Legătură: < / b >
< A href = „https://www.google.com/” clasă = 'inactiv' > Click aici < / A >

În codul de mai sus, linkul pe care se poate face clic are o clasă „inactiv” care va fi folosită pentru a accesa acest element HTML.



Codul de mai sus generează următoarea ieșire:





Făcând clic pe link, utilizatorul îl direcționează către motorul de căutare Google:





Proprietatea pointer-event

  • În interiorul unui element de stil CSS, scrieți proprietatea evenimentului pointer ( pointer-eveniment: niciunul ) în timp ce se referă la clasa (neactivă) care conține linkul care ar trebui să fie dezactivat.
  • Setați cursorul ca oricare dintre opțiuni precum implicit, niciunul, indicatorul etc.
= „text/css” >
.inactiv {
pointer-evenimente : nici unul ;
cursor : Mod implicit ;
}
>

După executarea codului, nu va exista nicio modificare în afișarea grafică a linkului din exterior, dar atunci când utilizatorul face clic pe el, nu va face nimic:

Acesta a fost cel mai simplu mod de a dezactiva linkul dintr-un cod folosind instrucțiuni CSS.

Concluzie

Un link care direcționează utilizatorul către alte pagini web poate fi dezactivat cu ușurință printr-o proprietate CSS simplă „pointer-events: none”. Acest lucru nu necesită nicio modificare a logicii codului sau a clasei în care a fost creată legătura. Este necesară o proprietate simple de eveniment pointer în elementul de stil care se referă la clasa care conține linkul.