Instantly share code, notes, and snippets.

View gist:eb4bb806878917915284943629518acd
<table class=”table”>
<thead>
<tr>
<th>Fullname</th>
<th>Biggest secret</th>
<th>Level of adorableness</th>
</tr>
</thead>
<tbody>
<tr>
View Glyphicons
@font-face {
font-family: 'Glyphicons Halflings';
src: url('../fonts/glyphicons-halflings-regular.eot');
src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
View Radio Buttons
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="radio" name="options" id="boots" autocomplete="off" checked> Boots
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="shoes" autocomplete="off"> Shoes
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="feet" autocomplete="off"> Feet
</label>
View Checkboxes
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary active">
<input type="checkbox" checked autocomplete="off"> Boots
</label>
<label class="btn btn-primary">
<input type="checkbox" autocomplete="off"> Shoes
</label>
<label class="btn btn-primary">
<input type="checkbox" autocomplete="off"> Feet
</label>
View Disabled State
<p><a href="#" class="btn btn-primary btn-lg disabled" role="button">The 'a' Element</a></p>
<p><button type="button" class="btn btn-lg btn-primary" disabled="disabled">The 'button' Element</button></p>
<p><input type="button" class="btn btn-lg btn-primary" disabled="disabled" value="The 'input' Element"></p>
View Block Level Buttons
<button type="button" class="btn btn-danger btn-lg btn-block">Block level button</button>
View Default size
<button type="button" class="btn btn-success">Default</button>
View Button Elements
<a class="btn btn-primary" href="#" role="button">Anchor</a>
<button class="btn btn-primary" type="submit">Button</button>
<input class="btn btn-primary" type="button" value="Input">
<input class="btn btn-primary" type="submit" value="Submit">
View Button Toolbar
<div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
<div class="btn-group mr-2" role="group" aria-label="First group">
<button type="button" class="btn btn-secondary">1</button>
<button type="button" class="btn btn-secondary">2</button>
<button type="button" class="btn btn-secondary">3</button>
<button type="button" class="btn btn-secondary">4</button>
</div>
<div class="btn-group mr-2" role="group" aria-label="Second group">
<button type="button" class="btn btn-secondary">5</button>
<button type="button" class="btn btn-secondary">6</button>
View Activate State
<a href="#" class="btn btn-primary btn-lg active" role="button" aria-pressed="true">Primary link</a>
<a href="#" class="btn btn-secondary btn-lg active" role="button" aria-pressed="true">Link</a>