Compartir a través de


cursor

Establece el tipo de puntero que se muestra a medida que el puntero se mueve sobre un objeto.

Sintaxis

{ cursor: sCursor }

Valores posibles

sCursor

Cadena que especifica o recibe uno o más de los siguientes valores posibles, separados por comas:

auto

Valor predeterminado. El explorador determina el puntero que se mostrará en función del contexto actual.

all-scroll

Flechas hacia arriba, abajo, izquierda y derecha con un punto en el centro, que indican que la página se puede desplazar en cualquier dirección.

col-resize

Flechas hacia la izquierda y derecha con una barra vertical que las separa, que indican que el elemento/columna se puede cambiar de tamaño horizontalmente.

crosshair

Cruz sencilla.

default

Puntero predeterminado que depende de la plataforma; normalmente es una flecha.

hand

Mano con el dedo índice hacia arriba, como cuando el usuario mueve el puntero sobre un vínculo.

help

Flecha con signo de interrogación, que indica que hay ayuda disponible.

move

Flechas en cruz que indican que algo se va a mover.

no-drop

Mano con un círculo pequeño y una línea que lo atraviesa para indicar que el elemento arrastrado no se puede colocar en la posición actual del puntero.

not-allowed

Círculo con una línea que lo atraviesa y que indica que la acción solicitada no se puede realizar.

pointer

Mano con el dedo índice hacia arriba, como cuando el usuario mueve el puntero sobre un vínculo. Es idéntico a hand.

progress

Flecha con un reloj de arena al lado, para indicar que se está ejecutando un proceso en segundo plano. La interacción del usuario con la página no resulta afectada.

row-resize

Flechas hacia arriba y abajo con una barra vertical que las separa, que indican que el elemento/fila se puede cambiar de tamaño verticalmente.

text

Texto editable; normalmente es una barra I.

url(uri)

Puntero definido por el autor mediante el empleo de un identificador uniforme de recursos (URI) personalizado, por ejemplo, url('mycursor.cur'). Los punteros de tipo .CUR y .ANI son los únicos tipos de puntero admitidos.

vertical-text

Texto vertical editable; se indica normalmente con una barra I horizontal.

wait

Reloj de arena o reloj que indica que el programa está ocupado y que el usuario debe esperar.

*-resize

Flechas que indican que un borde se va a mover. El asterisco (*) puede ser n, ne, nw, s, se, sw, e o w, donde cada valor representa una dirección de la brújula.

Esta propiedad tiene el valor predeterminado auto. Se hereda.

Observaciones

La propiedad controla una lista de valores separados por comas. Si el explorador no encuentra o por cualquier motivo no puede usar el primer puntero especificado, pasa al siguiente puntero de la lista separada por comas y continúa hasta que encuentra un puntero utilizable. Si el explorador no puede usar ninguno de los punteros de la lista, el puntero no cambia.

Ejemplos

En el siguiente ejemplo se usa la propiedad cursor para cambiar el puntero a medida que pasa sobre un objeto. Se utiliza una llamada a una hoja de estilo incrustada (global) para establecer el puntero en hand ya que el puntero pasa sobre todos los párrafos:

<style>
    p {cursor: hand;}
</style>

En este ejemplo se usa scripting en línea para establecer el puntero en hand ya que el puntero pasa sobre el párrafo:

<p onmouseover="this.style.cursor='hand'">

Información sobre estándares

Esta propiedad se define en la especificación Cascading Style Sheets (CSS), Level 2 (CSS2) (Hojas de estilos en cascada (CSS), nivel 2 (CSS2)).

Aplicable a

A, ADDRESS, APPLET, B, BIG, BLOCKQUOTE, BODY, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, CUSTOM, DD, DEFAULTS, DFN, DIV, DL, DT, EM, EMBED, FIELDSET, FORM, HN, HR, HTML, I, IFRAME, IMG, INPUT TYPE=BUTTON, INPUT TYPE=CHECKBOX, INPUT TYPE=FILE, INPUT TYPE=IMAGE, INPUT TYPE=PASSWORD, INPUT TYPE=RADIO, INPUT TYPE=RESET, INPUT TYPE=SUBMIT, INPUT TYPE=TEXT, LI, OBJECT, OL, P, RT, RUBY, S, SPAN, SUB, TABLE, TBODY, TD, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, XMP