Bootstrap-CL:面包屑导航
| ylbtech-Bootstrap-CL:面包屑导航 |
| 1.返回顶部 |
Bootstrap 面包屑导航(Breadcrumbs)
面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式。以博客为例,面包屑导航可以显示发布日期、类别或标签。它们表示当前页面在导航层次结构内的位置。
Bootstrap 中的面包屑导航(Breadcrumbs)是一个简单的带有 .breadcrumb class 的无序列表。分隔符会通过 CSS(bootstrap.min.css)中下面所示的 class 自动被添加:
.breadcrumb > li + li:before {
color: #CCCCCC;
content: "/ ";
padding: 0 5px;
}
下面的实例演示了面包屑导航:
实例
<ol class="breadcrumb">
<li><a href="#">Home</a></li>
<li><a href="#">2013</a></li>
<li class="active">十一月</li>
</ol>
结果如下所示:

| 2.返回顶部 |
| 3.返回顶部 |
| 4.返回顶部 |
| 5.返回顶部 |
| 11.返回顶部 |
![]() |
作者:ylbtech 出处:http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 |
Bootstrap-CL:面包屑导航的更多相关文章
- 【bootstrap】面包屑导航(Breadcrumbs)
.breadcrumb > li + li:before { color: #CCCCCC; content: "/ "; padding: 0 5px; } <ol ...
- Bootstrap <基础十八>面包屑导航(Breadcrumbs)
面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式.以博客为例,面包屑导航可以显示发布日期.类别或标签.它们表示当前页面在导航层次结构内的位置. Bootstrap 中的面包屑导航( ...
- Bootstrap (导航、标签、面包屑导航)
导航 Bootstrap中可用的导航有相似的标记,用基类.nav开头,这是相似的部分.改变修饰类可以改变样式. <!DOCTYPE html> <html> <head& ...
- Bootstrap面包屑导航
Bootstrap中提供了面包屑导航的实现方法: 只需要引入bootstrap.css文件即可. 主要引用的样式有: .span6 .breadcrumb 实例代码如下: <!DOCTYPE h ...
- Bootstrap——面包屑导航(Breadcrumbs)
面包屑导航(Breadcrumbs)是一种基于网站层次信息的显示方式. Bootstrap 中的面包屑导航(Breadcrumbs)是一个简单的带有 .breadcrumb 类的无序列表. <o ...
- Bootsrtap 面包屑导航(Breadcrums)
Bootstrap面包屑导航是一种基于网站层次信息显示的方式.以博客为例,面包屑导航可以显示发布日期,类别或标签,它们表示当前页面在导航层次结构内的位置. Bootstrap面包屑导航其实是一个简单的 ...
- 学习使用 CSS3 制作网站面包屑导航效果
作为最重要的导航展示形式之一,面包屑导航能够让用户更清楚的知道他们所在页面的层次结构,让他们可以方便的导航到上一层页面.在本教程中,您将学习如何使用 CSS3 技术创建自己的面包屑导航效果. 效果演示 ...
- NEC学习 ---- 模块 -多行式面包屑导航
如上面形式面包屑的写法: HTML如下, <div class="m-crumb"> <ul class="f-cb"> <li& ...
- WordPress 添加面包屑导航
所谓面包屑,就是类似这种:首页 > 公司简介 > 发展历史 展示网站树型结构,并让网站访问者随时知道自己所处的位置,方便返回上几级. 将下面的代码添加到主题的 functions.php ...
随机推荐
- luogu P1029 最大公约数和最小公倍数问题
https://www.luogu.org/problem/show?pid=1029 输入二个正整数x0,y0(2<=x0<100000,2<=y0<=1000000),求出 ...
- java bitmap/bitvector的分析和应用
转自: http://shmilyaw-hotmail-com.iteye.com/blog/1741608 简介 bitmap在很多海量数据处理的情况下会用到.一些典型的情况包括数据过滤, ...
- Android之提示Toast
步骤: 设置监听事件步骤1.事件源,如按键 btn_simple2.事件 OnClick3.监听器new OnClickListener3.绑定事件源与事件 setOnClickListener(ne ...
- Java IO流-合并流
2017-11-05 20:15:28 SequenceinputStream SequenceinputStream:SequenceInputStream 表示其他输入流的逻辑串联.它从输入流的有 ...
- node+websocket创建简易聊天室
关于websocket的介绍太多,在这就不一一介绍了,本文主要实现通过websocket创建一个简易聊天室,就是90年代那种聊天室 服务端 1.安装ws模块,uuid模块,ws是websocket模块 ...
- 过滤器系列(一)—— Bloom filter
因为要做过滤器相关内容,最近读了一些过滤器方面的文章,准备从中提取主要思想写几篇博客. 作为这系列的第一篇文章,首先得讲一下过滤器是干什么用的.从历史发展来看,过滤器最早出现是作为散列表的替代品,那么 ...
- icon fonts入门
iconfont网站 http://www.iconfont.cn(推荐) http://fontello.com/ http://fontawesome.io/ https://icomoon. ...
- Beta阶段第2周/共2周 Scrum立会报告+燃尽图 13
作业要求[https://edu.cnblogs.com/campus/nenu/2018fall/homework/2411] 版本控制:https://git.coding.net/liuyy08 ...
- spring boot 教程(二)模板依赖
在Spring boot中有一个很重要的概念,叫做约定优于配置--软件开发的简约原则.所以Spring boot会按照约定好的文件位置去找我们的包和类. 默认配置 Spring Boot默认提供静态资 ...
- HDU 3667
http://acm.hdu.edu.cn/showproblem.php?pid=3667 最小费用最大流 本题流量和费用不是线性关系,fee=a*flow*flow,所以常规套模板spfa无法得到 ...
