This page requires a Javascript enabled browser
<< Back | Main Menu | FAQ | [?]

Breadcrumbs

Create navigation aids in your webpages.

Local: CSS/JS files (add code to <HEAD> section):

1
2
<!-- DC Breadcrumbs CSS -->
<link type="text/css" rel="stylesheet" href="dcodes/breadcrumbs/css/dc_breadcrumbs.css" />

Hosted: CSS/JS files (add code to <HEAD> section):

1
2
<!-- DC Breadcrumbs CSS -->
<link type="text/css" rel="stylesheet" href="http://cdn.dcodes.net/2/breadcrumbs/css/dc_breadcrumbs.css" />

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-1">
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Mobile Phones</a></li>
    <li><a href="#">iPhone</a></li>
    <li class="current">Specs</li>
  </ul>
<!-- DC Breadcrumbs End -->

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-2">
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Mobile Phones</a></li>
    <li><a href="#">iPhone</a></li>
    <li class="current">Specs</li>
  </ul>
<!-- DC Breadcrumbs End -->

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-3">
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Mobile Phones</a></li>
    <li><a href="#">iPhone</a></li>
    <li>Specs</li>
  </ul>
<!-- DC Breadcrumbs End -->

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-4">
    <li><a href="">Home</a></li>
    <li><a href="">Products</a></li>
    <li><a href="">Mobile Phones</a></li>
    <li><a href="">iPhone</a></li>
    <li><a href="" class="current">Specs</a></li>
  </ul>
<!-- DC Breadcrumbs End -->

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-5">
    <li><a href="">Home</a></li>
    <li><a href="">Products</a></li>
    <li><a href="">Mobile Phones</a></li>
    <li><a href="">iPhone</a></li>
    <li><a href="" class="current">Specs</a></li>
  </ul>
<!-- DC Breadcrumbs End -->

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-6">
    <li><a href="">Home</a></li>
    <li><a href="">Products</a></li>
    <li><a href="">Mobile Phones</a></li>
    <li><a href="">iPhone</a></li>
    <li><a href="" class="current">Specs</a></li>
  </ul>
<!-- DC Breadcrumbs End -->

View code:

1
2
3
4
5
6
7
8
9
<!-- DC Breadcrumbs Start -->
  <ul id="dc_breadcrumb-7">
    <li><a href="">Home</a></li>
    <li><a href="">Products</a></li>
    <li><a href="">Mobile Phones</a></li>
    <li><a href="">iPhone</a></li>
    <li><a href="" class="current">Specs</a></li>
  </ul>
<!-- DC Breadcrumbs End -->


© TemplateAccess