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

Bootstrap面包屑导航其实是一个简单的class.breadcrums类的无序列表，其分隔由bootstrap.min.css提供自动添加。

实例：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：面包屑导航(Breadcrums)</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div style="padding:100px">
<ol class="breadcrumb">
<li>HTML前端</li>
<li>作者：melao2006</li>
<li>2015-11-23</li>
</ol>
</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootsrtap 面包屑导航(Breadcrums)的更多相关文章

  1. Bootstrap <基础十八>面包屑导航（Breadcrumbs）

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

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

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

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

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

  4. NEC学习 ---- 模块 -多行式面包屑导航

    如上面形式面包屑的写法: HTML如下, <div class="m-crumb"> <ul class="f-cb"> <li& ...

  5. WordPress 添加面包屑导航

    所谓面包屑,就是类似这种:首页 > 公司简介 > 发展历史 展示网站树型结构,并让网站访问者随时知道自己所处的位置,方便返回上几级. 将下面的代码添加到主题的 functions.php ...

  6. MVC 5 + EF6 入门完整教程14 -- 动态生成面包屑导航

    上篇文章我们完成了 动态生成多级菜单 这个实用组件. 本篇文章我们要开发另一个实用组件:面包屑导航. 面包屑导航(BreadcrumbNavigation)这个概念来自童话故事"汉赛尔和格莱 ...

  7. 织梦DedeCms去掉栏目页面包屑导航最后的分隔符“>”

    织梦DedeCms的面包屑导航调用标签{dede:field name=’position’ /},在栏目页里调用的面包屑导航,最后会出现分割符号“>”,如:主页 > DedeCms 模板 ...

  8. 夺命雷公狗ThinkPHP项目之----企业网站25之网站前台面包屑导航URL的完善

    如果想取出面包屑导航的url那么就必须在model层里面进行多取一个了: <?php namespace Home\Model; use Think\Model; class CategoryM ...

  9. 夺命雷公狗ThinkPHP项目之----企业网站24之网站前台列表页面包屑导航的显示

    我们做面包屑导航的原理其实也是很简单的,我们的思路是: 首先找到该分类的id ,我们可以通过大 I来进行获取得到: 然后通过 大 D 方法让数据进入model层里面进行循环迭代查询, 当然,测试时候发 ...

随机推荐

  1. MFC CMap整理

    映射表类(CMap)是MFC集合类中的一个模板类,也称作为“字典”.CMap是把唯一关键码映射到值的字典收集类,使用CMap可以构造一个关键字和元素值映射的集合类.一旦在映射中插入了一个关键码值对(元 ...

  2. LightOJ1197【数学】

    引自:WONTER 题意: 给你两个数,a,b,让你求区间[a,b]里面有多少个素数: 思路: 首先要知道,我们要想筛 [1, b] 中所有的素数,只需要用到 [1, sqrt(b)] 中的所有素数来 ...

  3. 用css写三角形，宽高可设置

    1.不传@h,@c === @h; 2.元素width = @w, 元素height = @h*2 3.配合上.center()实现图标居中 less版本: //上下左右居中 .center(){ p ...

  4. 进击python第二篇：初识

    入门拾遗 模块 模块用以导入python增强其功能扩展 1.使用 import [模块名] 导入,应用方式:模块. 函数,例: >>> import math >>> ...

  5. 洛谷P1919 【模板】A*B Problem升级版（FFT）

    传送门 话说FFT该不会真的只能用来做这种板子吧…… 我们把两个数字的每一位都看作多项式的系数 然后这就是一个多项式乘法 上FFT就好了 然后去掉前导零 (然而连FFT的板子都背不来orz,而且空间又 ...

  6. [Xcode 实际操作]八、网络与多线程-(7)使用MessageUI框架，创建并发送一封带有附件的邮件

    目录:[Swift]Xcode实际操作 本文将演示如何使用MessageUI框架,创建并发送一封带有附件的邮件. 使用邮件编辑视图控制器(MFMailComposeViewController)实现邮 ...

  7. jq weui 滚动加载的坑

    1.一般情况下使用官网给个demo就可以了,如下: var loading = false; //状态标记 $(document.body).infinite().on("infinite& ...

  8. JQuery获取iframe中window对象的方法-contentWindow

    document.getElementsByTagName('iframe')[0].contentWindow 获取到的就是iframe中的window对象.

  9. [題解]（最短路）luogu_P1119災後重建

    一道好題,然而看題解做的...... floyed的實質:只經過前k個點i到j的最短路,原狀態轉移方程為 f [ k ] [ i ] [ j ]=min( f[ k-1 ] [ i ] [ j ],f ...

  10. python之模块random,time,os,sys,序列化模块(json,pickle),collection

    引入:什么是模块:   一个模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py的后缀. 但其实import加载的模块分为四个通用类型. 1.使用python编写的代码(.py ...