它默认是居中显示的，如果我们需要一个居左一个居右显示的话，添加两个样式： previous 让“上一步”按钮居左； next 让“下一步”按钮居右。（同样可以使用 disabled 表示禁用状态）
<ul> <li><a href="#">«上一页</a></li> <li><a href="#">下一页»</a></li> </ul>
其他
标签
在一些Web页面中常常会添加一个标签用来告诉用户一些额外的信息，比如说在导航上添加了一个新导航项，可能就会加一个“new”标签，来告诉用户。这是新添加的导航项。
在Bootstrap专门将这样的效果提取成为了单独的标签组件。可以使用 <span> 这样的行内标签添加 .label 类来控制大小，再使用情景类来控制高亮显示的颜色如： label-default 、 label-danger 等等（在原来笔记中说到过这样的情景类，只不过这里需要加上不同的前缀）
徽章（角标）
其实和上面的标签效果很大一部分是类似的，一般用作信息提示，例如剩余多少未读信息等等，也就是我们常常能在右上角看到的未读信息提示。在Bootstrap中，把这种效果称作为徽章效果，使用 badge 类来实现。
给链接、导航等元素嵌套 <span> 元素，可以很醒目的展示新的或未读的信息条目。
<a href="#">Inbox <span>42</span></a> <button type="button"> Messages <span>4</span> </button>
通过查看源码，我们可以发现Bootstrap同样使用 :empty 伪元素，来设置当没有内容的时候隐藏：
.badge:empty { display: none; }
需要注意的是IE8 不支持 :empty 选择符，所以不会默认隐藏；
Bootstrap 中的徽章会适配导航元素的激活状态。
<ul role="tablist"> <li role="presentation"><a href="#">Home <span>42</span></a></li> <li role="presentation"><a href="#">Profile</a></li> <li role="presentation"><a href="#">Messages <span>3</span></a></li> </ul>
关于Bootstrap入门书籍之（五）导航条、分页导航就给大家介绍到这里，希望对大家有所帮助！
您可能感兴趣的文章: