twitter-bootstrap-3
Boutons dans twitter-bootstrap-3

Utiliser la classe twitter-bootstrap `btn`

btn classe btn de Twitter-bootstrap peut être utilisée avec n'importe lequel des éléments HTML suivants.

1. ancre
2. bouton
3. input with both type="button" and type="submit"

Vous trouverez ci-dessous des exemples de tous les cas d'utilisation possibles de la classe 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">

Bien que la classe btn puisse être utilisée de l'une des quatre manières ci-dessus, il est fortement recommandé d'utiliser l'élément <button> autant que possible

Image du code ci-dessus est attaché ci-dessous

La source

différentes tailles de bouton dans twitter-bootstrap-3

twitter-bootstrap-3 a fourni quatre tailles de boutons différentes

1. Grand bouton btn-lg
2. Le bouton par défaut does not require any btn size
3. Petit bouton btn-sm
4. Bouton extra petit 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>

Image du code ci-dessus est attaché ci-dessous

La source

Ajouter Glyphicon au bouton

Les glyphicons peuvent être utilisés dans le texte, les boutons, les barres d'outils, la navigation, les formulaires, etc. (Source: W3Schools). Les glyphicons sont fondamentalement des formes d'icônes qui peuvent être utilisées pour styliser tout ce qui précède. Ces exemples décrivent l'utilisation des glyphicons à l'intérieur de deux types de boutons en utilisant simplement un intervalle à l'intérieur des boutons qui ont une classe de type glyphicon:

Bouton HTML

<button type="button" class="btn btn-info">
    <span class="glyphicon glyphicon-search"></span> Search
</button>

Bouton ASP

<asp:LinkButton runat="server" CssClass="btn btn-info" >
    <span class="glyphicon glyphicon-envelope"></span> Email
</asp:LinkButton>