Menu
Is there a way that i can change the default separator ("/") with a custom icon in Bootstrap 3 breadcrumbs?
862
They can be changed by modifying a local CSS custom property --bs-breadcrumb-divider , or through the $breadcrumb-divider Sass variable — and $breadcrumb-divider-flipped for its RTL counterpart, if needed. We default to our Sass variable, which is set as a fallback to the custom property.
Go to Customizing Bootstrap page. Move to Breadcrumbs section. Override the default value of @breadcrumb-active-color varaible with the value that you need i.e. #000 . Move to Download section and press "Compile and Download" Button.
Bootstrap By Building Projects - Includes Bootstrap 4 Breadcrumbs are a great way to show hierarchy-based information for a site. In the case of blogs, breadcrumbs can show the dates of publishing, categories, or tags. They indicate the current page's location within a navigational hierarchy.
Indicate the current page's location within a navigational hierarchy that automatically adds separators via CSS.
This is not icon, you can add what ever you want, icon, image etc.
.breadcrumb > li + li:before { color: #ccc; content: "/ "; padding: 0 5px; } Change content to " >> " and see
103
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
