基本信息
源码名称：9种不同的面包屑导航(含步骤引导提示)
源码大小：0.01M
文件格式：.zip
开发语言：CSS
更新时间：2019-04-03
   友情提示：（无需注册或充值，赞助后即可获取资源下载链接）

     嘿，亲！知识可是无价之宝呢，但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下，绝对物超所值哦！如有下载和支付问题，请联系我们QQ(微信同号)：813200300

本次赞助数额为： 2 元　
   源码介绍 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
        <title>9种不同的面包屑和分布式多步骤导航</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
        <link rel="stylesheet" href="css/style.css"/>
        <script src="js/modernizr.js"></script>
    </head>
    <body>
        <div class="container">
            <div class="demo">
                <p>1、基本面包屑</p>
                <nav>
                    <ol class="cd-breadcrumb">
                        <li><a href="#">首页</a></li>
                        <li><a href="#">jQuery</a></li>
                        <li><a href="#">PHP</a></li>
                        <li class="current"><a href="#">模板</a></li>
                    </ol>
                </nav>
                <p>2、自定义分隔符面包屑</p>
                <nav>
                    <ol class="cd-breadcrumb custom-separator">
                        <li><a href="#">首页</a></li>
                        <li><a href="#">jQuery</a></li>
                        <li><a href="#">PHP</a></li>
                        <li class="current"><a href="#">模板</a></li>
                    </ol>
                </nav>
                <p>3、自定义图标面包屑</p>
                <nav>
                    <ol class="cd-breadcrumb custom-separator custom-icons">
                        <li><a href="#">首页</a></li>
                        <li><a href="#">jQuery</a></li>
                        <li><a href="#">PHP</a></li>
                        <li class="current"><a href="#">模板</a></li>
                    </ol>
                </nav>
                <p>4、三角箭头面包屑</p>
                <nav>
                    <ol class="cd-breadcrumb triangle">
                        <li><a href="#">首页</a></li>
                        <li><a href="#">jQuery</a></li>
                        <li><a href="#">PHP</a></li>
                        <li class="current"><a href="#">模板</a></li>
                    </ol>
                </nav>
                <p>5、三角箭头带图标面包屑</p>
                <nav>
                    <ol class="cd-breadcrumb triangle custom-icons">
                        <li><a href="#">首页</a></li>
                        <li><a href="#">jQuery</a></li>
                        <li><a href="#">PHP</a></li>
                        <li class="current"><a href="#">模板</a></li>
                    </ol>
                </nav>
                <p>6、基本分步指示</p>
                <nav>
                    <ol class="cd-multi-steps text-center">
                        <li class="visited"><a href="#0">购物车</a></li>
                        <li class="visited" ><a href="#0">结算付款</a></li>
                        <li class="current"><em>送货</em></li>
                        <li><em>验货收货</em></li>
                    </ol>
                </nav>
                <p>7、自定义图标分步指示</p>
                <nav>
                    <ol class="cd-multi-steps text-center custom-icons">
                        <li class="visited"><a href="#0">购物车</a></li>
                        <li class="visited" ><a href="#0">结算付款</a></li>
                        <li class="current"><em>送货</em></li>
                        <li><em>验货收货</em></li>
                    </ol>
                </nav>
                <p>8、圆点分步指示</p>
                <nav>
                    <ol class="cd-multi-steps text-top">
                        <li class="visited"><a href="#0">购物车</a></li>
                        <li class="visited" ><a href="#0">结算付款</a></li>
                        <li class="current"><em>送货</em></li>
                        <li><em>验货收货</em></li>
                    </ol>
                </nav>
                <p>9、带数字的圆点分步指示</p>
                <nav>
                    <ol class="cd-multi-steps text-bottom count">
                        <li class="visited"><a href="#0">购物车</a></li>
                        <li class="visited" ><a href="#0">结算付款</a></li>
                        <li class="current"><em>送货</em></li>
                        <li><em>验货收货</em></li>
                    </ol>
                </nav>
            </div>
        </div>
    <script type="text/javascript" src="http://shouce.ren/static/ad/gg.js"></script></body>
</html>