Què és Cursors en CSS?
Cada dia ja fem servir cursors personalitzats. Aquesta interacció és possible mitjançant l'ús de cursors modificats, com ara quan passeu el cursor per sobre dels botons, el cursor del punter es transforma en una mà o quan passeu el cursor per sobre del text i el cursor es transforma en un cursor de text.
Els cursors, però, també es poden utilitzar per oferir als nostres usuaris diverses oportunitats creatives addicionals.
Hem de ser conscients que CSS ja té cursors predeterminats per a diverses accions que es fan sovint abans de començar a desenvolupar els nostres cursors personalitzats.
llista d'enllaços java
Aquests cursors ofereixen opcions d'acció al punt precís sobre el qual esteu passant el cursor. Els exemples inclouen cursors que indiquen que hauríeu de fer clic als enllaços, arrossegar i deixar anar elements, ampliar i reduir els objectes i molt més.
Utilitzeu la propietat del cursor CSS per descriure el tipus de cursor que voleu.
Propietat del cursor CSS
Podem especificar el tipus de cursor que s'ha de mostrar a l'usuari mitjançant la propietat del cursor CSS.
L'ús de fotografies com a botons d'enviament als formularis és una aplicació útil d'aquesta capacitat. De manera predeterminada, apareix una mà en lloc d'un punter quan un cursor està per sobre d'un enllaç. Tanmateix, el botó d'enviament d'un formulari no fa que canviï de formulari. Això serveix com a senyal visual que es pot fer clic a la imatge cada vegada que algú passa el cursor per sobre d'una imatge que és un botó d'enviament.
Aquesta propietat s'especifica per zero o més valors separats per comes, seguits d'un valor de paraula clau segons sigui necessari, i cadascun es referirà al fitxer d'imatge.
quants anys té Kylie Jenner
Sintaxi
cursor: value;
Valors de propietat
Automàtic: | La configuració predeterminada d'aquest atribut és col·locar el cursor.
Àlies: | Aquest atribut s'utilitza per mostrar l'indicador relacionat amb la creació del cursor.
Tot el desplaçament: | El cursor en aquest atribut indica el desplaçament.
Cel·la: | El cursor d'aquesta propietat indica que s'ha escollit una cel·la o un grup de cel·les.
Menú contextual: | El cursor en aquest atribut mostra la presència d'un menú contextual.
Redimensionament del coll: | Quan el cursor està per sobre d'una columna d'aquesta propietat, es pot canviar la mida horitzontalment.
Còpia: | El cursor en aquesta propietat indica que s'ha de copiar alguna cosa.
Punt de mira: | El cursor apareix com a punt de mira en aquest atribut.
Per defecte: | El cursor predeterminat.
Redimensionament electrònic: | El cursor en aquest atribut indica que s'ha de moure la vora dreta d'un quadre.
Redimensiona: | El cursor d'aquest atribut representa un cursor de redimensionament bidireccional.
Ajuda: | En aquesta propietat, el cursor mostra que l'assistència és accessible.
Moure: | El punter d'aquesta propietat implica que alguna cosa s'ha de moure
. n-canviar la mida: | Quan s'utilitza la propietat n-resize, el punter mostra que el límit superior d'una caixa s'ha de desplaçar.
Quina mida: | Amb aquesta propietat, el cursor mostra que la vora d'una caixa s'ha de desplaçar cap a la dreta i cap amunt.
Nou canvi de mida: | El cursor de canvi de mida bidireccional s'indica amb aquest atribut.
Ns-canvi de mida: | Un cursor de canvi de mida bidireccional s'indica amb l'atribut ns-resize.
Nw-canvi de mida: | El cursor d'aquest atribut mostra que les vores superior i inferior d'una caixa s'han de moure cap amunt i cap a l'esquerra.
Redimensionament del nas: | El cursor de canvi de mida bidireccional s'indica amb aquest atribut.
Sense caiguda: | El cursor en aquest atribut indica que l'objecte extret no es pot bolcar en aquesta ubicació.
Cap: | No es mostra cap cursor per a l'element segons aquest atribut.
No permès: | El cursor en aquesta propietat indica que l'acció sol·licitada no es durà a terme.
Apuntador: | El cursor d'aquesta propietat serveix com a punter i mostra el progrés de l'enllaç.
Progrés, progressar: | El cursor en aquest atribut mostra que el programa està actiu.
Canvi de mida de fila: | El cursor mostra que aquesta característica permet canviar la mida de la fila vertical.
Canvi de mida S: | Quan s'utilitza aquesta propietat, el punter mostra que s'ha de baixar el límit inferior d'una caixa.
Redimensiona se: | El cursor d'aquest atribut indica que la vora d'una caixa s'ha de desplaçar cap a la dreta i cap avall.
Redimensionament SW: | El cursor en aquest atribut indica que s'han de moure les vores esquerra i inferior d'un quadre.
Text: | El cursor en aquest atribut indica el text que es pot triar.
URL: | Aquesta propietat conté una llista d'URL de cursor personalitzats separats per comes i un cursor genèric al final de la llista.
Text vertical: | El cursor d'aquest atribut mostra possibles seleccions de text vertical.
Canvi de mida W: | Quan s'utilitza aquesta propietat, el punter mostra que la vora esquerra d'una caixa s'ha de moure.
Exemple
Aquest exemple mostra com utilitzar la propietat del cursor. El programa està ocupat perquè el valor de la propietat del cursor està configurat per esperar.
java ordenant una llista
CSS cursor property .wait { cursor: wait; } h1 { color: red; } <p> Login Credentials </p>
Sortida
Podem especificar el tipus de cursor que s'ha de mostrar a l'usuari mitjançant la propietat del cursor CSS. L'ús de fotografies com a botons d'enviament als formularis és una aplicació útil d'aquesta capacitat. De manera predeterminada, apareix una mà en lloc d'un punter quan el cursor està per sobre d'un enllaç.