<div class="container">
<div class="row">
<ul class="breadcrumb">
<li><a href="#">bootstrap</a></li>
<li><a href="#">dist</a></li>
<li class="active">css</li>
</ul>
</div> <!-- 分页 -->
<div class="row" style="margin-top:20px">
<ul class="pagination pagination-lg">
<li class="disabled"><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 class="active"><a href="#">5</a></li>
<li><a href="#">>></a></li>
</ul>
</div> <!-- 翻页 -->
<div class="row" style="margin-top:20px">
<ul class="pager">
<li><a href="#">&larr;上一页</a></li>
<li><a href="#">下一页&rarr;</a></li>
</ul>
</div>
<div class="row" style="margin-top:20px">
<div class="col-lg-5">
<ul class="pager">
<li class="previous disabled"><a href="#">&larr;上一页</a></li>
<li class="next"><a href="#">下一页&rarr;</a></li>
</ul>
</div>
</div>
</div>

效果图:

bootstrap-面包屑和分页的更多相关文章

  1. Bootstrap面包屑导航

    Bootstrap中提供了面包屑导航的实现方法: 只需要引入bootstrap.css文件即可. 主要引用的样式有: .span6 .breadcrumb 实例代码如下: <!DOCTYPE h ...

  2. Bootstrap——面包屑导航(Breadcrumbs)

    面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式. Bootstrap 中的面包屑导航(Breadcrumbs)是一个简单的带有 .breadcrumb 类的无序列表. <o ...

  3. WordPress的Bootstrap面包屑导航

    <ol class="breadcrumb"> 当前位置: <li><a href="<?php bloginfo('url'); ? ...

  4. bootstrap面包屑在ie8下显示重叠,鼠标点击显示效果正常

    ie8下加载后的显示 点击之后的显示 主要是li标签宽度auto引起的,可以设置li标签的最小宽度 <ol class="breadcrumb"> <li id= ...

  5. Bootstrap-CL:面包屑导航

    ylbtech-Bootstrap-CL:面包屑导航 1.返回顶部 1. Bootstrap 面包屑导航(Breadcrumbs) 面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式 ...

  6. Bootsrtap 面包屑导航(Breadcrums)

    Bootstrap面包屑导航是一种基于网站层次信息显示的方式.以博客为例,面包屑导航可以显示发布日期,类别或标签,它们表示当前页面在导航层次结构内的位置. Bootstrap面包屑导航其实是一个简单的 ...

  7. Bootstrap <基础十八>面包屑导航(Breadcrumbs)

    面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式.以博客为例,面包屑导航可以显示发布日期.类别或标签.它们表示当前页面在导航层次结构内的位置. Bootstrap 中的面包屑导航( ...

  8. Bootstrap (导航、标签、面包屑导航)

    导航 Bootstrap中可用的导航有相似的标记,用基类.nav开头,这是相似的部分.改变修饰类可以改变样式. <!DOCTYPE html> <html> <head& ...

  9. Bootstrap <基础十九>分页

    Bootstrap 支持的分页特性.分页(Pagination),是一种无序列表,Bootstrap 像处理其他界面元素一样处理分页. 分页(Pagination) 下表列出了 Bootstrap 提 ...

  10. 学习使用 CSS3 制作网站面包屑导航效果

    作为最重要的导航展示形式之一,面包屑导航能够让用户更清楚的知道他们所在页面的层次结构,让他们可以方便的导航到上一层页面.在本教程中,您将学习如何使用 CSS3 技术创建自己的面包屑导航效果. 效果演示 ...

随机推荐

  1. string.Format格式化

    ,)//填充,结果为02,003

  2. bzoj 2763: [JLOI2011]飞行路线

    #include<cstdio> #include<cstring> #include<iostream> #include<queue> #defin ...

  3. curl请求的时候总是提示400

    今天用curl测试一个接口,一直提示400 最后发现是url的问题,如下处理就可以了 $url = str_replace(' ', '+', $url);

  4. NSURLCache 和 NSCache 的区别

    NSURLCache 和 NSCache 的区别 NSURLCache提供的是URL Request缓存,可以在Memory和Disk上:NSCache提供了HTTP Request外的东西的缓存方式 ...

  5. Asp.net MVC 视图(二)

    Razor视图引擎 使用C#语法的Razor视图文件扩展名为.cshtml:使用Visual Basic语法的Razor视图文件扩展名为.vbhtml.文件扩展名指出了Razor语法分析器的编码语言的 ...

  6. 【转】 linux之sed用法

    sed是一个很好的文件处理工具,本身是一个管道命令,主要是以行为单位进行处理,可以将数据行进行替换.删除.新增.选取等特定工作,下面先了解一下sed的用法sed命令行格式为:         sed ...

  7. O365 "打开或关闭脚本"功能

    博客地址:http://blog.csdn.net/FoxDave 自定义功能是 SharePoint Online 最具吸引力的功能之一,因为它使管理员和用户可以调整网站和页面的外观以满足组织目 ...

  8. CSS 选择器【详解】

    转自:http://www.cnblogs.com/polk6/archive/2013/07/19/3142142.html CSS 选择器及各样式引用方式介绍 一个好的界面,是一个Web吸引人们最 ...

  9. javaweb--struts框架--struts.xml

    <?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC "-/ ...

  10. windows核心编程---第六章 线程的调度

    每个线程都有一个CONTEXT结构,保存在线程内核对象中.大约每隔20ms windows就会查看所有当前存在的线程内核对象.并在可调度的线程内核对象中选择一个,将其保存在CONTEXT结构的值载入c ...