<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. 从一个ISP移至另一个ISP而不改变IP的方案

    某客户从一个ISP_A移到了另一个ISP_B.但是,其WEB服务器由于之前对外公布的是IP地址,且无DNS,因此,要求该服务器搬至ISP_B后,用户依然可以访问原来的IP地址,求方案. 假设:ISP_ ...

  2. [双连通分量] POJ 3694 Network

    Network Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 9434   Accepted: 3511 Descripti ...

  3. Jenkins快速上手

    一.Jenkins下载安装 1.到官网下载jenkins.war包:http://jenkins-ci.org/ 2.安装方法有两种: a) 把下载下来的jenkins.war包放到文件夹下,如C:\ ...

  4. Windows Server 2003 Sp2 下无法安装SQL Server 2008 Management Studio Express问题

    Windows Server 2003 Sp2 下无法安装SQL Server 2008 Management Studio Express问题钉子 发表于 2010-5-22 1:42:51问题描述 ...

  5. excel 两列 找出相同的值

    excel 有A,B两列数值,要找出A,B两列中数值相同的值. 选中B列,格式——条件格式——公式  输入:=countif(A:A,B1)  在格式中可选择突出字体颜色 该函数的语法规则如下: co ...

  6. java的eclipse操作和常用类Object的使用

    1.eclipse的快捷键: (1)alt + /   内容辅助. 如:main+alt + / 会出现完整的main方法. syso+alt+ / 会输出. 如编写某个方法时,只需写入方法名 + a ...

  7. xpcall 安全调用

    -- xpall (调用函数f, 错误函数fe[, 参数]) function fun(a,b)   -- 这里的参数没什么实际作用,就是展示下用法    return a / bend -- xpc ...

  8. Collection(数组、字典、集合)

    Collection     -NSArray和NSMutableArray         +array:创建一个空数组         +arrayWithArray:从另一个数组创建新的数组   ...

  9. 用javascript判断一个html元素是否存在的五种方法:

    1. 判断表单元素是否存在(一) if("periodPerMonth" in document.theForm){ return true; }else{ return fals ...

  10. Hive 实战(2)--hive分区分桶实战

    前言: 互联网应用, 当Mysql单机遇到性能瓶颈时, 往往采用的优化策略是分库分表. 由于互联网应用普遍的弱事务性, 这种优化效果非常的显著.而Hive作为数据仓库, 当数据量达到一定数量时, 查询 ...