Bootstrap 4 Breadcrumb with style properties

There are three classes used , breadcrumb, breadcrumb-item, breadcrumb-item active

<ol class='breadcrumb'>
  <li class='breadcrumb-item'><a href='#'>Home</a></li>
  <li class='breadcrumb-item'><a href='#'>JQuery</a></li>
  <li class='breadcrumb-item active'>Breadcrumb Demo</li>
</ol>
Without using list markup
<ol class='breadcrumb'>
  <a href='#' class='breadcrumb-item'>Home</a></li>
  <a href='#' class='breadcrumb-item'>JQuery</a>
  <span class='breadcrumb-item'>Breadcrumb Demo</span>
</ol>

Changing height , width , border , background colour etc for a breadcrumb

We can override the default style of Bootstrap breadcrumb by declaring our own style.

Here is example of style properties.
<style>
ol.breadcrumb {
 background: #ffff00;
 color: #0000ff;
 font-size: 16px;
 width: 700;
 height: 60;
 border: 3px solid;
 border-color: #ff0000;
 border-radius: 10px;
}
</style>
Above code can be generated by using different options.


Subscribe

* indicates required
Subscribe to plus2net

    plus2net.com









    Most Popular JQuery Scripts

    1

    Two dependant list boxes

    2

    Calendar with Date Selection

    3

    Data change by Slider

    4

    Show & Hide element


    JQuery Video Tutorials




    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2021 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer