twitter-bootstrap-3
Botones en twitter-bootstrap-3
Buscar..
Usando la clase `btn` de twitter-bootstrap
btn clase btn de Twitter-bootstrap se puede usar con cualquiera de los siguientes elementos html.
- ancla
- botón
- ingresa
with both type="button" and type="submit"
A continuación se muestran ejemplos de todos los posibles casos de uso de la clase btn
<a class="btn" href="#" role="button">Link</a>
<button class="btn" type="submit">Button</button>
<input class="btn" type="button" value="Input">
<input class="btn" type="submit" value="Submit">
Aunque la clase btn puede usar de cualquiera de las cuatro formas anteriores, se recomienda usar el elemento <button> siempre que sea posible
La imagen del código anterior se adjunta a continuación
Diferentes tamaños de botón en twitter-bootstrap-3.
twitter-bootstrap-3 ha proporcionado cuatro tamaños diferentes de botones
- Botón grande
btn-lg - El botón predeterminado
does not require any btn size - Botón pequeño
btn-sm - Botón extra pequeño
btn-xs
<button type="button" class="btn btn-lg">Large button</button>
<button type="button" class="btn">Default button</button>
<button type="button" class="btn btn-sm">Small button</button>
<button type="button" class="btn btn-xs">Extra small button</button>
La imagen del código anterior se adjunta a continuación
Añadir Glyphicon al botón
Los glifos se pueden usar en texto, botones, barras de herramientas, navegación, formularios, etc. (Fuente: W3Schools). Los glifos son básicamente formas de iconos que pueden usarse para estilizar cualquiera de los anteriores. Estos ejemplos describen el uso de glyphicons dentro de dos tipos de botones simplemente usando un espacio dentro de los botones que tienen una clase de tipo glyphicon:
Botón HTML
<button type="button" class="btn btn-info">
<span class="glyphicon glyphicon-search"></span> Search
</button>
Botón ASP
<asp:LinkButton runat="server" CssClass="btn btn-info" >
<span class="glyphicon glyphicon-envelope"></span> Email
</asp:LinkButton>


