Hacer un botón para tu web

Saber hacer un botón es muy útil para tu web, porque lo vas a usar en múltiples ocasiones. Por ejemplo, puede ser interesante resaltar un elemento del menú, pues para ello puedes hacerlo de esta manera. También puede ser interesante si quieres poner un botón en el texto de una página o de una entrada.

Hacer un botón es además muy sencillo, solo tienes que seguir estos pasos y saber exactamente dónde tienes que pegarlo.

Crear la etiqueta:

<p class=miboton> EJEMPLO</p> 

Es decir, si estás escribiendo una entrada y quieres poner un botón, debes pegar esto a modo de HTML. Donde pone “ejemplo” pon lo que quieres que aparezca en el botón en formato texto (“descargar”, “saber más”, “contacto”, “comprar”…)

A esta clase la he llamado “miboton”, pero tú puedes darle el nombre que quieres. Lo importante es que no tenga un nombre que pueda estar en el tema de tu página, porque entonces crearía conflicto. Por lo tanto, puedes usar este de “miboton” o poner uno que tu elijas (pero original).

Poner en el CSS adicional: 

Una vez que has pegado el pequeño código en tu página web, tienes que decirle a la web como es esa clase que has llamado “miboton” o el nombre elegido. Para ello, tienes que ir al apartado de CSS adicional que tengas en tu tema y pegarlo.

Con el siguiente código que te doy tienes ya unas condiciones creadas, pero ya luego es jugar con los valores que te he puesto. Estos valores son lo que van dentro de las {}, es decir, desde “display” hasta el final.

.miboton { 
Display:block; 
Padding:10px 10px; 
Background-color:#f3704a; 
Border:1px solid #000000; 
font-size: 16px;  
font-weight:bold; 
border-radius: 6px; 
-moz-border-radius:6px; 
-webkit-border-radius:6px; 
-o-border-radius:6px; 
} 
boton html