创建一个标签式的导航菜单的步骤是:

  • 在ul标签上加上class  nav
  • 再ul标签上加上 class .nav-tabs

在li标签上加上 active表示激活该项

<ul class="nav nav-tabs">

<li class="active"><a href="#">Home</a></li>

<li><a href="#">SVN</a></li>

<li><a href="#">iOS</a></li>

<li><a href="#">VB.Net</a></li>

<li><a href="#">Java</a></li>

<li><a href="#">PHP</a></li>

</ul>

创建一个胶囊式标签只需要把 nav-tabs改成:nav-pills.

<ul class="nav nav-pills">

<li class="active"><a href="#">Home</a></li>

<li><a href="#">SVN</a></li>

<li><a href="#">iOS</a></li>

<li><a href="#">VB.Net</a></li>

<li><a href="#">Java</a></li>

<li><a href="#">PHP</a></li>

</ul>

第九篇.bootstrap导航的更多相关文章

  1. 第九篇 Integration Services:控制流任务错误

    本篇文章是Integration Services系列的第九篇,详细内容请参考原文. 简介在前面三篇文章,我们创建了一个新的SSIS包,学习了脚本任务和优先约束,并检查包的MaxConcurrentE ...

  2. 自定义bootstrap样式-9行样式自定义漂亮大气bootstrap导航栏

    有人说前端发展太快,框架太多,各有所需,各有所长.看看这幅图,估计都知道这些框架,但是大部分公司中实际要用到的也就那么几个. 发展再快,框架再多.还是得回到原点,不就是Html+Css+JavaScr ...

  3. 【译】第九篇 Integration Services:控制流任务错误

    本篇文章是Integration Services系列的第九篇,详细内容请参考原文. 简介在前面三篇文章,我们创建了一个新的SSIS包,学习了脚本任务和优先约束,并检查包的MaxConcurrentE ...

  4. Bootstrap导航栏navbar源码分析

    1.本文目地:分析bootstrap导航栏及其响应式的实现方式,提升自身css水平 先贴一个bootstrap的导航栏模板 http://v3.bootcss.com/examples/navbar- ...

  5. Spring Cloud第九篇 | 分布式服务跟踪Sleuth

    ​ ​本文是Spring Cloud专栏的第九篇文章,了解前八篇文章内容有助于更好的理解本文: Spring Cloud第一篇 | Spring Cloud前言及其常用组件介绍概览 Spring Cl ...

  6. 第二篇.Bootstrap起步

    第二篇Bootstrap起步 我们可以在http://getbootstrap.com下载bootstrap的文件 点击左边的download bootstrap可以下载bootstrap的css,j ...

  7. 解剖SQLSERVER 第九篇 OrcaMDF现在能通过系统DMVs显示元数据(译)

    解剖SQLSERVER 第九篇  OrcaMDF现在能通过系统DMVs显示元数据(译) http://improve.dk/orcamdf-now-exposes-metadata-through-s ...

  8. 第九篇 SQL Server代理了解作业和安全

    本篇文章是SQL Server代理系列的第九篇,详细内容请参考原文 在这一系列的上一篇,学习了如何在SQL Server代理作业步骤启动外部程序.你可以使用过时的ActiveX系统,运行批处理命令脚本 ...

  9. 第九篇 :微信公众平台开发实战Java版之如何实现自定义分享内容

    第一部分:微信JS-SDK介绍 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包. 通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统 ...

随机推荐

  1. Linux中设置服务自启动的三种方式

    有时候我们需要Linux系统在开机的时候自动加载某些脚本或系统服务 主要用三种方式进行这一操作: ln -s                       在/etc/rc.d/rc*.d目录中建立/e ...

  2. linux node安装

    安装node0.10.24版本,升级了两个版本/usr/local/src/node/0.10.24/usr/local/n/versions/node/4.4.7/usr/local/n/versi ...

  3. 输入事件驱动---evdev_handler的大致实现流程(修整版)

    一.input输入子系统框架 下 图是input输入子系统框架,输入子系统由输入子系统核心层(input core),驱动层和事件处理层(Event Handler)三部分组成.一个输入事件,比如滑动 ...

  4. 转:Eclipse插件开发之TreeViewer

    http://www.tuicool.com/articles/e6fmE3R contentprovider在插件开发和RCP(Rich Client Platform)开发中常常被用到,譬如你要创 ...

  5. iOS开发 QQ粘性动画效果

    QQ(iOS)客户端的粘性动画效果 时间 2016-02-17 16:50:00  博客园精华区 原文  http://www.cnblogs.com/ziyi--caolu/p/5195615.ht ...

  6. VMware虚拟机12安装linux系统

    http://jingyan.baidu.com/article/4f7d5712d20a1b1a21192760.html 阿里云开源镜像站:http://mirrors.aliyun.com/

  7. 【转】 C++的精髓——虚函数

    虚函数为了重载和多态的需要,在基类中是由定义的,即便定义是空,所以子类中可以重写也可以不写基类中的函数! 纯虚函数在基类中是没有定义的,必须在子类中加以实现,很像java中的接口函数! 虚函数 引入原 ...

  8. 7 -- Spring的基本用法 -- 1...2

    7.1 Spring简介和Spring4.0的变化 7.1.1 Spring 简介 当使用Spring框架时,必须使用Spring Core Container(即Spring容器),它代表了Spri ...

  9. PHP Fatal error: Class 'DOMDocument' not found

     PHP Fatal error:  Class 'DOMDocument' not found 给PHP添加 xml模块: yum install php-xml 如果是PHP5,则用 yum in ...

  10. Windbg使用简明指南

    第一章 准备 1.1.    环境配置 _NT_DEBUGGER_EXTENSION_PATH=C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727 _NT_SY ...