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.

Your Rating




Google+






Most Popular JQuery Scripts

1

Two dependant list boxes

2

Calendar with Date Selection

3

Data change by Slider

4

Show & Hide element
HTML . MySQL. PHP. JavaScript. ASP. Photoshop. Articles. FORUM Contact us
©2000-2018 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer