ylbtech-Bootstrap-CL:面包屑导航
1.返回顶部
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、
2.返回顶部
 
3.返回顶部
 
4.返回顶部
 
5.返回顶部
1、
2、
 
11.返回顶部
 
作者:ylbtech
出处:http://ylbtech.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

Bootstrap-CL:面包屑导航的更多相关文章

  1. 【bootstrap】面包屑导航(Breadcrumbs)

    .breadcrumb > li + li:before { color: #CCCCCC; content: "/ "; padding: 0 5px; } <ol ...

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

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

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

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

  4. Bootstrap面包屑导航

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

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

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

  6. Bootsrtap 面包屑导航(Breadcrums)

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

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

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

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

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

  9. WordPress 添加面包屑导航

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

随机推荐

  1. LA 7278 Game of Cards(SG函数)

    https://vjudge.net/problem/UVALive-7278 题意: 两个人玩游戏,现在有n堆牌,轮到自己时,先在牌堆中选一堆牌,先在牌堆中选择拿走0~k张牌(至少得剩下一张),然后 ...

  2. Java回顾之多线程同步

    在这篇文章里,我们关注线程同步的话题.这是比多线程更复杂,稍不留意,我们就会“掉到坑里”,而且和单线程程序不同,多线程的错误是否每次都出现,也是不固定的,这给调试也带来了很大的挑战. 在这篇文章里,我 ...

  3. node中session的管理

    请看这个博客:   http://spartan1.iteye.com/blog/1729148 我自己的理解 session俗称会话. 第一次访问服务器的时候由服务器创建,相当于一个cookie(就 ...

  4. phpstudy一个域名配置两个网站(一个是thinkphp5,一个是原生php)

    phpstudy一个域名配置两个网站(一个是thinkphp5,一个是原生php) 一.总结 一句话总结:把原生php的网站直接放到thinkphp5的public目录下可以解决以stem.aaaa. ...

  5. UVA-11248 Frequency Hopping (最大流+最小割)

    题目大意:给一张网络,问是否存在一条恰为C的流.若不存在,那是否存在一条弧,使得改动这条弧的容量后能恰有为C的流? 题目分析:先找出最大流,如果最大流不比C小,那么一定存在一条恰为C的流.否则,找出最 ...

  6. Cookie是什么?从哪来?存在哪?往哪去?

    什么是cookie? cookie最简单的介绍就是服务器返回的一个字符串信息,只不过我们每次请求都需要把它发送给服务器.以AFN和android-async-http为例子,默认都会把cookie自动 ...

  7. Java LRU的实现

    最近在leetcode上做题的时,看到了一道有关LRU Cache的题目,正好我当初面试阿里巴巴的时候问到的.主要采用linkedHashMap来实现. package edu.test.algori ...

  8. 抽象工厂 C++实现

    抽象工厂(Abstract Factory) 抽象工厂是为了提供一系列相关或相互依赖对象的接口.对象创建型模式的一种. 客户Client 抽象工厂接口AbstractFactory 抽象工厂的实现类C ...

  9. fatal error: openssl/evp.h: 没有那个文件或目录

    在陆佳华<嵌入式系统软硬件协同设计实战指南 第2版>一书的第13章节 编译U-boot时会遇到2个错误.原因很简单,就从一开始的错误提示着手: fatal error: openssl/e ...

  10. easyui api常用操作

    一.FORM表单类 一.textbox validatebox 验证 1.验证规则:validType : 验证规则,类型STRING|ARRAY:1个规则就直接一个字符串,多个规则写在数组里 例如: ...