diff options
Diffstat (limited to 'docs/components/breadcrumb.md')
| -rw-r--r-- | docs/components/breadcrumb.md | 23 |
1 files changed, 16 insertions, 7 deletions
diff --git a/docs/components/breadcrumb.md b/docs/components/breadcrumb.md index bfd7ef1b6..204a60c81 100644 --- a/docs/components/breadcrumb.md +++ b/docs/components/breadcrumb.md @@ -8,17 +8,26 @@ Indicate the current page's location within a navigational hierarchy. Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content). +Works fine with or without the usage of list markup. + {% example html %} <ol class="breadcrumb"> - <li class="active">Home</li> + <li class="breadcrumb-item active">Home</li> </ol> <ol class="breadcrumb"> - <li><a href="#">Home</a></li> - <li class="active">Library</li> + <li class="breadcrumb-item"><a href="#">Home</a></li> + <li class="breadcrumb-item active">Library</li> </ol> -<ol class="breadcrumb" style="margin-bottom: 5px;"> - <li><a href="#">Home</a></li> - <li><a href="#">Library</a></li> - <li class="active">Data</li> +<ol class="breadcrumb"> + <li class="breadcrumb-item"><a href="#">Home</a></li> + <li class="breadcrumb-item"><a href="#">Library</a></li> + <li class="breadcrumb-item active">Data</li> </ol> +<!-- Or use a div instead of a list --> +<div class="breadcrumb"> + <a class="breadcrumb-item" href="#">Home</a> + <a class="breadcrumb-item" href="#">Library</a> + <a class="breadcrumb-item" href="#">Data</a> + <span class="breadcrumb-item active">Bootstrap</span> +</div> {% endexample %} |