CSS - cursor

Descripción

La propiedad curosr se utiliza en dispositivos de audio para reproducir un sonido después de un elemento.

Valores posibles

La siguiente tabla muestra los valores posibles 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, un mensaje de texto, una entrega de un enlace, etc.
2	crosshair Una cruz o un signo más
3	default Una flecha
4	pointer Una mano apuntando (en IE 4 este valor es mano)
5	move El bar
6	e-resize El cursor indica que un borde de un cuadro se debe mover hacia la derecha (este)
7	ne-resize El cursor indica que el 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-resize El cursor indica que un borde de un cuadro se moverá hacia arriba (norte)
10	se-resize 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 un borde de un cuadro se debe mover hacia abajo y hacia la izquierda (sur / oeste)
12	s-resize El cursor indica que un borde de un cuadro se moverá hacia abajo (sur)
13	w-resize El cursor indica que un borde de un cuadro se debe mover hacia la izquierda (oeste)
14	text El bar
15	wait Un reloj de arena
dieciséis	help Un signo de interrogación o un globo, ideal para usar sobre los botones de ayuda
17	<url> La fuente de un archivo de imagen de cursor

NOTE- Debe intentar usar solo estos valores para agregar información útil para los usuarios y en los lugares en los que esperarían ver ese cursor. Por ejemplo, usar la cruz cuando alguien pasa el cursor sobre un enlace puede confundir a los visitantes.

Se aplica a

Todos los elementos HTML.

Sintaxis DOM

object.style.cueAfter = url("music.wav");

Ejemplo

Aquí está el 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>

Esto producirá el siguiente resultado, intente mover el puntero del mouse sobre diferentes propiedades:

↰ Previous page