bootstrap button tags

1<button type="button" class="btn btn-primary">Blue</button>
2<button type="button" class="btn btn-secondary">Grey</button>
3<button type="button" class="btn btn-success">Green</button>
4<button type="button" class="btn btn-danger">Red</button>
5<button type="button" class="btn btn-warning">Yellow</button>
6<button type="button" class="btn btn-info">Ligth blue</button>
7<button type="button" class="btn btn-light">White</button>
8<button type="button" class="btn btn-dark">Black</button>
9
10<button type="button" class="btn btn-link">White with blue text</button>

1Bootstrap includes several predefined button styles, each serving its own
2semantic purpose, with a few extras thrown in for more control.
3Using color to add meaning only provides a visual indication, which will
4not be conveyed to users of assistive technologies – such as screen readers. 
5Ensure that information denoted by the color is either obvious from the 
6content itself (e.g. the visible text), or is included through alternative
7means, such as additional text hidden with the .sr-only class.
8
9<button type="button" class="btn btn-primary">Primary</button>
10<button type="button" class="btn btn-secondary">Secondary</button>
11<button type="button" class="btn btn-success">Success</button>
12<button type="button" class="btn btn-danger">Danger</button>
13<button type="button" class="btn btn-warning">Warning</button>
14<button type="button" class="btn btn-info">Info</button>
15<button type="button" class="btn btn-light">Light</button>
16<button type="button" class="btn btn-dark">Dark</button>
17
18<button type="button" class="btn btn-link">Link</button>

1<button type="button" class="btn btn-lg btn-primary" disabled>Primary button</button>
2<button type="button" class="btn btn-secondary btn-lg" disabled>Button</button>

1<button type="button" class="btn btn-primary">Primary</button>
2<button type="button" class="btn btn-secondary">Secondary</button>
3<button type="button" class="btn btn-success">Success</button>
4<button type="button" class="btn btn-danger">Danger</button>
5<button type="button" class="btn btn-warning">Warning</button>
6<button type="button" class="btn btn-info">Info</button>
7<button type="button" class="btn btn-light">Light</button>
8<button type="button" class="btn btn-dark">Dark</button>
9<button type="button" class="btn btn-link">Link</button>
10<a class="btn btn-primary" href="#" role="button">Link</a>
11<button class="btn btn-primary" type="submit">Button</button>
12<input class="btn btn-primary" type="button" value="Input">
13<input class="btn btn-primary" type="submit" value="Submit">
14<input class="btn btn-primary" type="reset" value="Reset">
15<button type="button" class="btn btn-outline-primary">Primary</button>
16<button type="button" class="btn btn-outline-secondary">Secondary</button>
17<button type="button" class="btn btn-outline-success">Success</button>
18<button type="button" class="btn btn-outline-danger">Danger</button>
19<button type="button" class="btn btn-outline-warning">Warning</button>
20<button type="button" class="btn btn-outline-info">Info</button>
21<button type="button" class="btn btn-outline-light">Light</button>
22<button type="button" class="btn btn-outline-dark">Dark</button>
23<button type="button" class="btn btn-primary btn-lg">Large button</button>
24<button type="button" class="btn btn-secondary btn-lg">Large button</button>
25<button type="button" class="btn btn-primary btn-sm">Small button</button>
26<button type="button" class="btn btn-secondary btn-sm">Small button</button>
27<a href="#" class="btn btn-primary btn-lg active" role="button" aria-pressed="true">Primary link</a>
28<a href="#" class="btn btn-secondary btn-lg active" role="button" aria-pressed="true">Link</a>
29<button type="button" class="btn btn-lg btn-primary" disabled>Primary button</button>
30<button type="button" class="btn btn-secondary btn-lg" disabled>Button</button>
31<a href="#" class="btn btn-primary btn-lg disabled" role="button" aria-disabled="true">Primary link</a>
32<a href="#" class="btn btn-secondary btn-lg disabled" role="button" aria-disabled="true">Link</a>
33<button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false" autocomplete="off">
34  Single toggle
35</button>
36<div class="btn-group-toggle" data-toggle="buttons">
37  <label class="btn btn-secondary active">
38    <input type="checkbox" checked autocomplete="off"> Checked
39  </label>
40</div>
41<div class="btn-group btn-group-toggle" data-toggle="buttons">
42  <label class="btn btn-secondary active">
43    <input type="radio" name="options" id="option1" autocomplete="off" checked> Active
44  </label>
45  <label class="btn btn-secondary">
46    <input type="radio" name="options" id="option2" autocomplete="off"> Radio
47  </label>
48  <label class="btn btn-secondary">
49    <input type="radio" name="options" id="option3" autocomplete="off"> Radio
50  </label>
51</div>

1The .btn classes are designed to be used with the <button> element. 
2However, you can also use these classes on <a> or <input> elements
3(though some browsers may apply a slightly different rendering).
4
5When using button classes on <a> elements that are used to trigger in-page 
6functionality (like collapsing content), rather than linking to new pages or 
7sections within the current page, these links should be given a role="button" 
8to appropriately convey their purpose to assistive technologies such as screen 
9readers.
10
11<a class="btn btn-primary" href="#" role="button">Link</a>
12<button class="btn btn-primary" type="submit">Button</button>
13<input class="btn btn-primary" type="button" value="Input">
14<input class="btn btn-primary" type="submit" value="Submit">
15<input class="btn btn-primary" type="reset" value="Reset">

1<button type="button" class="btn btn-primary">Blue</button>
2<button type="button" class="btn btn-secondary">Grey</button>
3<button type="button" class="btn btn-success">Green</button>
4<button type="button" class="btn btn-danger">Red</button>
5<button type="button" class="btn btn-warning">Orange</button>
6<button type="button" class="btn btn-info">Navy Blue</button>
7<button type="button" class="btn btn-light">Light Grey</button>
8<button type="button" class="btn btn-dark">Black</button>
9
10<button type="button" class="btn btn-link">Link</button>