Outline buttons

Bootstrap 4 has added some new button styles with outline buttons. Outline buttons appear hollow or are simply inverses of regular buttons.

Here is example code to demonstrate outline buttons. Place this code at the end of the container element of index.html:

<hr>
<button type="button" class="btn btn-primary-outline">Primary</button>
<button type="button" class="btn btn-secondary-outline">Secondary</button>
<button type="button" class="btn btn-success-outline">Success</button>
<button type="button" class="btn btn-warning-outline">Warning</button>
<button type="button" class="btn btn-danger-outline">Danger</button>
<hr>

Here is how the code looks:

Get JavaScript: Moving to ES2015 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial