Bootstrap 4 - Badges

by ewin2712

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
<div class="container">
  <nav class="navbar fixed-top navbar-inverse bg-primary">
    <h1 class="navbar-brand mb-0">Bootstrap 4 - Badges</h1>
  </nav>
  <br/>
  <br/>
  <br/>
  <div class="page-header">
  <h1>Headings</h1><hr/>
  </div>
  <h1>Cabecera h1 <span class="badge badge-default">badge default</span></h1>
  <h2>Cabecera h2 <span class="badge badge-primary">badge primary</span></h2>
  <h3>Cabecera h3 <span class="badge badge-success">badge success</span></h3>
  <h4>Cabecera h4 <span class="badge badge-info">badge info</span></h4>
  <h5>Cabecera h5 <span class="badge badge-warning">badge warning</span></h5>
  <h6>Cabecera h6 <span class="badge badge-danger">badge danger</span></h6>
  <br />
  <div class="page-header">
  <h1>Pills</h1><hr/>
  </div>
  <span class="badge badge-pill badge-default">Default</span>
  <span class="badge badge-pill badge-primary">Primary</span>
  <span class="badge badge-pill badge-success">Success</span>
  <span class="badge badge-pill badge-info">Info</span>
  <span class="badge badge-pill badge-warning">Warning</span>
  <span class="badge badge-pill badge-danger">Danger</span>
</div>