los cursor La propiedad de CSS le permite especificar el tipo de cursor que debe mostrarse al usuario.
Un buen uso de esta propiedad es el uso de imágenes para botones de envío en formularios. De forma predeterminada, cuando un cursor se desplaza sobre un enlace, el cursor cambia de un puntero a una mano. Sin embargo, no cambia la forma de un botón de envío en un formulario. Por lo tanto, cada vez que alguien coloca el cursor sobre una imagen que es un botón de envío, proporciona una pista visual de que se puede hacer clic en la imagen.
La siguiente tabla muestra los posibles valores para la propiedad del cursor:
| No Señor. | Valor y descripción |
|---|---|
| 1 |
auto La forma del cursor depende del área de contexto sobre la que se encuentra. Por ejemplo, una I sobre un mensaje de texto, una entrega de un enlace, etc. |
| 2 |
punto de mira Una cruz o un signo más |
| 3 |
defecto Una flecha |
| 4 |
puntero Una mano apuntando (en IE 4 este valor es mano) |
| 5 |
moverse El bar |
| 6 |
cambio de tamaño electrónico El cursor indica que un borde de un cuadro se debe mover hacia la derecha (este) |
| 7 |
ne-redimensionar El cursor indica que un borde de un cuadro se debe mover hacia arriba y hacia la derecha (norte / este) |
| 8 |
nw-resize El cursor indica que un borde de un cuadro se debe mover hacia arriba y hacia la izquierda (norte / oeste) |
| 9 |
n-redimensionar El cursor indica que un borde de un cuadro se moverá hacia arriba (norte) |
| 10 |
cambiar el tamaño El cursor indica que un borde de un cuadro se debe mover hacia abajo y hacia la derecha (sur / este) |
| 11 |
sw-resize El cursor indica que el borde de un cuadro se debe mover hacia abajo y hacia la izquierda (sur / oeste) |
| 12 |
s-cambiar el tamaño El cursor indica que un borde de un cuadro se moverá hacia abajo (sur) |
| 13 |
w-redimensionar El cursor indica que un borde de un cuadro se debe mover hacia la izquierda (oeste) |
| 14 |
texto El bar |
| 15 |
Espere Un reloj de arena |
| dieciséis |
ayuda Un signo de interrogación o un globo, ideal para usar sobre los botones de ayuda. |
| 17 |
La fuente de un archivo de imagen de cursor |
NOTA – Debe intentar usar solo estos valores para agregar información útil para los usuarios y, en algunos lugares, esperarían ver ese cursor. Por ejemplo, usar el punto de mira cuando alguien pasa el cursor sobre un enlace puede confundir a los visitantes.
Aquí hay un ejemplo:
<html>
<head>
</head>
<body>
<p>Move the mouse over the words to see the cursor change:</p>
<div style = "cursor:auto">Auto</div>
<div style = "cursor:crosshair">Crosshair</div>
<div style = "cursor:default">Default</div>
<div style = "cursor:pointer">Pointer</div>
<div style = "cursor:move">Move</div>
<div style = "cursor:e-resize">e-resize</div>
<div style = "cursor:ne-resize">ne-resize</div>
<div style = "cursor:nw-resize">nw-resize</div>
<div style = "cursor:n-resize">n-resize</div>
<div style = "cursor:se-resize">se-resize</div>
<div style = "cursor:sw-resize">sw-resize</div>
<div style = "cursor:s-resize">s-resize</div>
<div style = "cursor:w-resize">w-resize</div>
<div style = "cursor:text">text</div>
<div style = "cursor:wait">wait</div>
<div style = "cursor:help">help</div>
</body>
</html>
Producirá el siguiente resultado:
