Manual cursores
Manual de cursores
Te dejamos un manual de cursores para que aprendas más y los utilises en tu sitio web o blog !
| Nombre del cursor | Definicion CSS |
| Cursor mano (Por defecto) | Hand |
| Cursor estilo mira | crosshair |
| Flecha horizontal con dos puntas (izquierda, derecha) | e-resize |
| Cursor más signo de interrogación | help |
| Cruz con cuatro flehas (Simbolo mover) | move |
| Flecha vertical con dos puntas (arriba, abajo) | n-resize |
| Flecha cruzada con dos puntas | ne-resize |
| Mano Simbolo de los vinculos | pointer |
| Reloj de arena | progress |
| Guion de texto | text |
La tabla fue hecha por Css Plantillas
Nota: Tenga en cuenta que los cusores pueden variar según el sistema operativo que utilizan o porque hayan cambiando el aspecto del mouse.
Se puede modificar el cursor a cierta parte de un texto o enlace
Ejemplo:
<html>
<head>
<title>Cursores</title>
</head>
<body>
<a href="http://google.com" style="cursor:help">Ir a google<a>
</body>
</html>
<head>
<title>Cursores</title>
</head>
<body>
<a href="http://google.com" style="cursor:help">Ir a google<a>
</body>
</html>
Resultado:
Así mismo se puede modificar el aspecto del cursor en todo el documento.
Ejemplo:
<html>
<head>
<title>Cursores</title>
</head>
<style type="text/css">
body {
cursor: wait
}
</style>
<body>
<p>Este es un texto de prueba</p>
</body>
</html>
<head>
<title>Cursores</title>
</head>
<style type="text/css">
body {
cursor: wait
}
</style>
<body>
<p>Este es un texto de prueba</p>
</body>
</html>
Resultado:
Este es un texto de prueba
También colocar un cursor personalizado. Este efecto sólo se observará con el navegador Internet Explorer. Además la imagen debe tener la extensión .cur o .ani.
Ejemplo:
<html>
<head>
<title>Cursores</title>
</head>
<style type="text/css">
body {
cursor: url('mi_cursor.cur')
}
</style>
<body>
<p>Este es un texto de prueba. El efecto sólo se observará con el navegador Internet Explorer.</p>
</body>
</html>
<head>
<title>Cursores</title>
</head>
<style type="text/css">
body {
cursor: url('mi_cursor.cur')
}
</style>
<body>
<p>Este es un texto de prueba. El efecto sólo se observará con el navegador Internet Explorer.</p>
</body>
</html>
