хлебные крошки

Работа с Bootstrap

Иконки из набора Font Awesome прекрасно сочетаются с фреймворками вроде Bootstrap. Хотя этот фреймворк уже содержит необходимый набор иконок, его можно расширить за счёт сторонних комплектов.

Хлебные крошки

Название «хлебные крошки» пошло из детских сказок. Помните историю про мальчика, который по пути рассыпал хлебные крошки и по ним сумел найти обратную дорогу домой. Впрочем, в одной из версий крошки склевали птицы и это дало толчок новым приключениям героя. На сайтах навигация в виде хлебных крошек применяется чтобы показать путь к текущему документу и его положение в иерархии сайта.

Хлебные крошки в Bootstrap 5

Bootstrap предлагает класс .breadcrumb, который стилизует список в виде хлебных крошек.

Bootstrap добавляет к списку разделители (с помощью :before и content), а также display: inline-block к элементу <li> — в результате получается эффект «хлебных крошек».