La propiedad cursor establece la apariencia
del cursor al pasar sobre un elemento.
Sintaxis
selector {
cursor: valor;
}
Nota
La propiedad tiene muchos valores. A continuación,
he agrupado estos valores para que sea más fácil
orientarse. La apariencia del cursor difiere
en diferentes navegadores, por lo que no he hecho fotos
de los cursores, sino que simplemente en las tablas de valores
he hecho una columna especial, al pasar el ratón
sobre cuya celda, podrás ver la apariencia
del cursor descrito.
Valores
| Valor |
Descripción |
Apariencia |
default |
Apariencia estándar en forma de puntero-flecha.
|
|
pointer |
Se utiliza para mostrar que el elemento
es activo y se puede hacer clic en él
(este es el predeterminado para los enlaces).
|
|
help |
Se utiliza para mostrar que con el elemento
está asociada alguna ayuda o pregunta.
|
|
not-allowed |
Se utiliza para mostrar la inadmisibilidad de la operación.
|
|
Texto
| Valor |
Descripción |
Apariencia |
text |
Cursor de texto estándar en forma de barra vertical.
|
|
vertical-text |
Cursor de texto para texto vertical.
|
|
Espera
| Valor |
Descripción |
Apariencia |
progress |
Se utiliza para mostrar que está ocurriendo
alguna operación y el usuario necesita esperar.
|
|
wait |
Se utiliza para mostrar que el usuario
necesita esperar.
|
|
Cursor al cambiar tamaños
Al cambiar el tamaño de un elemento, el valor
de la propiedad se forma así: la palabra resize,
y antes, a través de un guión, alguna letra o
varias letras, por ejemplo: n-resize o ne-resize.
Estas letras son las primeras letras de los puntos
cardinales: north - norte, south - sur, east - este,
west - oeste. En este caso, se utilizan
las convenciones aceptadas para los mapas topográficos:
arriba el norte, abajo el sur, izquierda el oeste, derecha
el este. Por supuesto, esto confunde, ¡pero tendremos que
usarlo como está inventado!:)
Entonces, aquí están los valores:
| Valor |
Dirección |
Punto cardinal |
Apariencia |
n-resize |
hacia arriba |
north (norte) |
|
ne-resize |
derecha y arriba |
north east (noreste) |
|
e-resize |
derecha |
east (este) |
|
se-resize |
derecha y abajo |
south east (sureste) |
|
s-resize |
abajo |
south (sur) |
|
sw-resize |
izquierda y abajo |
south west (suroeste) |
|
w-resize |
izquierda |
west (oeste) |
|
nw-resize |
izquierda y arriba |
north west (noroeste) |
|
nesw-resize |
derecha-arriba e izquierda-abajo |
north east - south west (noreste - suroeste) |
|
nwse-resize |
izquierda-arriba y derecha-abajo |
north west - south east (noroeste - sureste) |
|
Cambio de tamaño de dos elementos
| Valor |
Descripción |
Apariencia |
col-resize |
Cambio horizontal. |
|
row-resize |
Cambio vertical. |
|
Cambio de zoom
| Valor |
Descripción |
Apariencia |
zoom-in |
Aumentar el zoom. |
|
zoom-out |
Disminuir el zoom. |
|
Movimiento
| Valor |
Descripción |
Apariencia |
move |
Se utiliza para mostrar que el elemento
se puede mover, o en el momento del movimiento.
|
|
all-scroll |
Se utiliza para mostrar que el elemento
se desplaza con el ratón en todas las direcciones.
|
|
Varios
| Valor |
Descripción |
Apariencia |
crosshair |
Apariencia en forma de mira.
|
|
cell |
Apariencia en forma de mira.
|
|