Bootstrap---面包屑导航，分页

最新推荐文章于 2024-06-18 10:23:48 发布

GQ_cyan

最新推荐文章于 2024-06-18 10:23:48 发布

阅读量1k

点赞数

分类专栏： css系列

本文链接：https://blog.csdn.net/GQ_cyan/article/details/52475780

版权

web前端同时被 2 个专栏收录

43 篇文章 0 订阅

订阅专栏

css系列

11 篇文章 0 订阅

订阅专栏

面包屑：

.breadcrumb

代码实现：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="bootstrap-3.3.6/js/jquery.cyan1.js"></script>
<script type="text/javascript" src="bootstrap-3.3.6/dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="bootstrap-3.3.6/dist/css/bootstrap.min.css" />
</head>

<body>
<ol class="breadcrumb">
	<li><a href="#">首页</a></li>
	<li><a href="#">我的文章</a></li>
	<li class="active">详细</li>
</ol>
</body>
</html>

分页：

.pagination

代码实现：

<ul class="pagination">
    <li><a href="#">«</a></li>
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li><a href="#">»</a></li>
</ul>