Hola todos :
como de costumbre, estoy llegando tarde. Aprovecho el mensaje para agregar 3 comentarios.
El tema ya se tocó antes varias veces; y hay algunas flechas más.
Webdings, ¿sólo para Explorer?
Los caracteres pueden no verse iguales por las propiedades de la fuente. El navegador redondea el tamaño si la fuente original no lo tiene disponible (4; 6; 8; 10; y 12 puntos debería estar en cualquiera). No todas las fuentes tienen todas las flechas, y el navegador la va a reemplazar por otra (o por un "" ) que quizá no tenga el mismo tamaño. También puede haber problemas de formato (p.e. :
bold) que deforme el alto con respecto al ancho.
Por último, sí se pueden hacer botones con forma de flechas
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<style>
body{
text-align : center;
}
.arriba{
width : 50px;
height : 50px;
font-size : 1px;
border-style : solid;
border-top-color : #fff;
border-left-color : #fff;
border-right-color : #fff;
border-bottom-color : #000;
border-top-width : 1px;
border-left-width : 25px;
border-right-width : 25px;
border-bottom-width : 50px;
background-color : #000;
padding : 0;
}
.derecha{
width : 50px;
height : 50px;
font-size : 1px;
border-style : solid;
border-top-color : #fff;
border-left-color : #000;
border-right-color : #fff;
border-bottom-color : #fff;
border-top-width : 25px;
border-left-width : 50px;
border-right-width : 1px;
border-bottom-width : 25px;
background-color : #000;
padding : 0;
}
.izquierda{
width : 50px;
height : 50px;
font-size : 1px;
border-style : solid;
border-top-color : #fff;
border-left-color : #fff;
border-right-color : #000;
border-bottom-color : #fff;
border-top-width : 25px;
border-left-width : 1px;
border-right-width : 50px;
border-bottom-width : 25px;
background-color : #000;
padding : 0;
}
.abajo{
width : 50px;
height : 50px;
font-size : 20px;
border-style : solid;
border-top-color : #000;
border-left-color : #fff;
border-right-color : #fff;
border-bottom-color : #000;
border-top-width : 50px;
border-left-width : 25px;
border-right-width : 25px;
border-bottom-width : 1px;
background-color : #000;
padding : 0;
}
</style>
</HEAD>
<BODY>
<input type="button" class="arriba" value="" onclick="alert('arriba')" /> <br /> <br />
<input type="button" class="derecha" value="" onclick="alert('derecha')" /> <br /> <br />
<input type="button" class="izquierda" value="" onclick="alert('izquierda')" /> <br /> <br />
<input type="button" class="abajo" value="" onclick="alert('abajo')" />
</BODY></HTML>
saludos
furoya