Hvordan endre markør til en håndpeker i CSS

Det er mange typer markører som brukes på forskjellige skjermer. Du kan endre type markør ved å bruke CSS -markøregenskapen, som spesifiserer hvilken type markør som skal vises for brukeren, for eksempel håndpeker, ta tak, kopi osv. Vi kan endre en vanlig markør i en håndpeker ved å gi "pekeren" -verdien til markøregenskapen.

I denne artikkelen vil vi lære:

• “markør”Eiendom
• Syntaks av markøreiendommer
• Hvordan endre markøren til en håndpeker i CSS?

La oss komme i gang!

“Markør” CSS -eiendom

CSS “markør”Egenskaper kontrollerer utseendet til musepekeren når det er over et element. Markøregenskapen i CSS lar oss endre en vanlig markør til en håndmarkør, kopimarkør, cellemarkør, hente markør osv. Hver markørform tjener forskjellige formål. For eksempel indikerer kopimarkøren å kopiere teksten, og håndpekeren indikerer å klikke på lenker eller menyer. Nå flytter vi til syntaksen til markøregenskapen.

Syntaks av markøreiendommer

Syntaksen til markøregenskapen er:

Markør: verdi;

I stedet for 'verdi', kan vi tilordne verdien av markøren som vi vil vise på skjermen. For eksempel peker, kopier, ta tak og mange flere.

Etter å ha forstått markørens syntaks, vil vi flytte til eksemplet der vi endrer den vanlige markøren i en håndpeker.

Hvordan endre markør til en håndpeker i CSS?

La oss vurdere et praktisk eksempel for å illustrere arbeid med markøregenskapen.

Eksempel

I dette eksemplet oppretter vi en liste i HTML -fil som inneholder tre elementer:

• Html


• CSS


• JavaScript

For øyeblikket ser markøren vår slik ut:

Etter det vil vi flytte til CSS -filen og sette markørverdien til en “peker”For å endre markørtype til håndpeker. Dessuten vil vi sette marginen på listen som "25px”Og margin-venstre som“500px”Dette er fordi det vil skape plass mellom listeelementer og også fra venstre side av listen:

li
Markør: peker;
Margin: 25px;
margin-venstre: 500px;

Vi har satt markørverdien til “peker“, Som vil endre seg til en håndpeker når brukeren vil sveve over et listeelement.

Etter implementeringen av CSS -koden, gå til HTML og se resultatet:

Her kan vi se at når markøren beveger seg til listeelementet, endres den til en håndpeker. Dette er på grunn av “markør”Eiendom

Konklusjon

Markøregenskapen i CSS tillater å bytte en vanlig markør til en håndpeker. For å endre den vanlige markøren til en håndpeker, må du tilordne “peker”Verdi til markøregenskapen. Du kan bruke hvilken som helst type markør du vil vise på skjermen. Denne artikkelen demonstrerer metoden for å endre markøren til en håndpeker.