22.路径导航与分页

来源：互联网发布：手机淘宝怎样改地址编辑：程序博客网时间：2024/06/01 09:57
<!doctype html><html><head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1">    <title>Bootstrap</title>    <link rel="stylesheet" href="css/bootstrap.css" /></head><body>    <div class="container"><!--路径导航，即可以显示文件的位置-->        <div class="row">            <ul class="breadcrumb"><!--breadcrumb是面包碎屑的意思-->                <li><a href="#">bootstrap</a></li>                <li><a href="#">dist</a></li>                <li><a href="#">css</a></li>            </ul>        </div>    <!--分页-->        <div class="row">            <ul class="pagination">                <li><a href="#">&lt;&lt;</a></li>                <li><a href="#">1</a></li>                <li><a href="#">2</a></li>                <li class="active"><a href="#">3</a></li><!--active显示位于当前页-->                <li><a href="#">4</a></li>                <li><a href="#">5</a></li>                <li><a href="#">&gt;&gt;</a></li>            </ul>        </div>        <div class="row">            <ul class="pagination pagination-lg"><!--大的分页-->                <li><a href="#">&lt;&lt;</a></li>                <li><a href="#">1</a></li>                <li><a href="#">2</a></li>                <li class="active"><a href="#">3</a></li>                <li><a href="#">4</a></li>                <li><a href="#">5</a></li>                <li><a href="#">&gt;&gt;</a></li>            </ul>        </div>        <div class="row">            <ul class="pagination pagination-sm"><!--小的分页-->                <li><a href="#">&lt;&lt;</a></li>                <li><a href="#">1</a></li>                <li><a href="#">2</a></li>                <li class="active"><a href="#">3</a></li>                <li><a href="#">4</a></li>                <li><a href="#">5</a></li>                <li><a href="#">&gt;&gt;</a></li>            </ul>        </div>        <div class="row"><!--翻页-->            <ul class="pager">                <li><a href="#">&larr;上一页</a></li>                <li><a href="#">下一页&rarr;</a></li>            </ul>        </div>        <div class="row">            <ul class="pager">                <li class="previous"><a href="#">&larr;上一页</a></li>                <li class="next"><a href="#">下一页&rarr;</a></li>            </ul>        </div>    </div>    <script src="js/jquery-2.1.0.js"></script>    <script src="js/bootstrap.js"></script></body></html>
这里写图片描述
0 0