diff options
| author | Pierre-Denis Vanduynslager <[email protected]> | 2017-01-16 00:45:04 -0500 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2017-01-15 21:45:04 -0800 |
| commit | 1528516dd6fc886322ee2f7822a8bdb7b74e966e (patch) | |
| tree | ff40580178d8e6e22ebfc51d1172e0b062047459 /docs | |
| parent | 5eb67091b5f97868e825fcc72dae7a4ad4545463 (diff) | |
| download | bootstrap-1528516dd6fc886322ee2f7822a8bdb7b74e966e.tar.xz bootstrap-1528516dd6fc886322ee2f7822a8bdb7b74e966e.zip | |
Add doc example with badge links (#21674)
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/components/badge.md | 13 |
1 files changed, 13 insertions, 0 deletions
diff --git a/docs/components/badge.md b/docs/components/badge.md index 4e4bafcde..896c917f3 100644 --- a/docs/components/badge.md +++ b/docs/components/badge.md @@ -53,3 +53,16 @@ Use the `.badge-pill` modifier class to make badges more rounded (with a larger <span class="badge badge-pill badge-warning">Warning</span> <span class="badge badge-pill badge-danger">Danger</span> {% endexample %} + +## Links + +Using the `.badge` classes with the `<a>` element quickly provide _actionable_ badges with hover and focus states. + +{% example html %} +<a href="#" class="badge badge-default">Default</a> +<a href="#" class="badge badge-primary">Primary</a> +<a href="#" class="badge badge-success">Success</a> +<a href="#" class="badge badge-info">Info</a> +<a href="#" class="badge badge-warning">Warning</a> +<a href="#" class="badge badge-danger">Danger</a> +{% endexample %} |