Cambiar el Puntero con CSS
Muchas veces necesitará dar un cambio al puntero dentro de sus páginas web, con este ejercicio aprenderá a hacerlo de una menera muy sencilla, les dejo el código completo y además un video-tutorial para que lo vean cuantas veces sea necesario.
<html>
<head><title>Cambio de Punteros con CSS</title>
<style type="text/css">
div {
width:240px;
height:100px;
margin:10px;
background-color:#ff8000;
float:left;
text-align:center;
line-height:90px;
font-family:arial;
box-shadow: 1px 1px 15px 0px#999;
}
#default {cursor:default}
#cruz {cursor:crosshair}
#puntero {cursor:pointer}
#nw-resize {cursor:nw-resize}
#ne-resize {cursor:ne-resize}
#n-resize {cursor:n-resize}
#e-resize {cursor:e-resize}
#ayuda {cursor:help}
#texto {cursor:text}
#espera {cursor:wait}
</style>
</head>
<body>
<div id="default">Default</div>
<div id="cruz">Cruz</div>
<div id="puntero">Puntero</div>
<div id="nw-resize">Nw-resize</div>
<div id="ne-resize">Ne-resize</div>
<div id="n-resize">N-resize</div>
<div id="e-resize">E-resize</div>
<div id="ayuda">Ayuda</div>
<div id="texto">Texto</div>
<div id="espera">Espera</div>
</body>
</html>
No hay comentarios:
Publicar un comentario