twitter-bootstrap-3
Schaltflächen in Twitter-Bootstrap-3

Verwendung der twitter-bootstrap-Klasse "btn"

btn Klasse von Twitter-Bootstrap kann mit jedem der folgenden HTML-Elemente verwendet werden.

1. Anker
2. Taste
3. Eingabe with both type="button" and type="submit"

Nachfolgend finden Sie Beispiele aller möglichen Anwendungsfälle der btn Klasse

<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">

btn Klasse btn kann zwar auf eine der vier oben genannten Arten verwendet werden, empfiehlt sich jedoch nach Möglichkeit, das Element <button> verwenden

Das Bild des obigen Codes ist unten beigefügt

Quelle

verschiedene Tastengrößen in twitter-bootstrap-3

twitter-bootstrap-3 hat vier verschiedene Tastengrößen zur Verfügung gestellt

1. Große btn-lg
2. Die Standardschaltfläche does not require any btn size
3. Kleine btn-sm
4. Extra kleine 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>

Das Bild des obigen Codes ist unten beigefügt

Quelle

Glyphicon zum Button hinzufügen

Glyphicons können in Text, Schaltflächen, Symbolleisten, Navigation, Formularen usw. verwendet werden (Quelle: W3Schools). Glyphikons sind im Grunde Symbolformen, mit denen alle oben genannten gestaltet werden können. In diesen Beispielen wird die Verwendung von Glyphicons in zwei Arten von Schaltflächen beschrieben, indem einfach ein Bereich innerhalb der Schaltflächen verwendet wird, die eine Klasse vom Typ Glyphicon haben:

HTML-Schaltfläche

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

ASP-Schaltfläche

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