¿Cómo cuadran las esquinas de un botón de envío? ¿Se puede hacer con CSS? Me di cuenta de que los botones de Stackoverflow son más o menos lo mismo (no lo cierres por mencionar SO, solo quiero ilustrar lo que quiero decir).Cómo usar CSS para cuadrar la esquina de un botón de envío
Simplemente agregue CSS y la apariencia predeterminada desaparecerá.
input.button, input.submit {
border: 1px outset blue;
background-color: lightBlue;
}
edición: cambió el selector de utilizar el nombre de clase en su lugar, como se sugiere en los comentarios.
[type = button] puede que no siempre sea compatible con ciertos navegadores, por lo que a menudo es mejor que aplique una clase para todos los botones que desee diseñar de esa manera ... – Nathan
que funciona con type = submit – Ankur
¿No es mejor proporcionar un nombre de clase para eso? – rahul
Puede usar el elemento HTML en lugar del tipo de entrada. Es bastante fácil de diseñar ese.
Use border: 1px solid para el elemento.
<a class="test">click me</a>
<style>
.test
{
cursor: pointer;
background-color:#E0EAF1;
border-bottom:1px solid #3E6D8E;
border-right:1px solid #7F9FB6;
color:#3E6D8E;
font-size:90%;
line-height:2.2;
margin:2px 2px 2px 0;
padding:3px 4px;
text-decoration:none;
white-space:nowrap;
}
</style>
Así es como se hace un botón de stackoverflow.
Si especifica el alto y el ancho en el CSS, hará las esquinas cuadradas, y conservará el cierto nivel de fantasía automática que tienen los botones normales ... y de esa manera, no tendrá que construir su propio.
input.button, input.submit {
height: 30px;
width: 20px;
}
Parece que recuerdo que esto solo funciona si la altura es lo suficientemente grande, pero podría funcionar de cualquier manera.
utilizar el siguiente campo y el mando en el CSS:
border-radius:0px
Creo que buscando en la fuente de SO hubiera sido tan rápido;). –