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

  • 在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. 如何为CriteriaOperator过滤对象转换为lambda表达式，即：linq to xpo的动态where语句

    How to convert the CriteriaOperator to a lambda expression, so, the latter expression can be used in ...

  2. WPF的学习笔记(1) -- （积累自2016年5月1日 至 2016年6月1日）

    敬告读者:因为是事件驱动模式的高速学习,高速学习意味着,不系统,不科学,不合逻辑,不一定正确.所以要是有不对的地方,页面下面留言给我,跪谢! 背景介绍: 最近在公司的开发工作中,接手了从别的公司交代过 ...

  3. road习题（二）

    答案:[C] 解析:2 8 原则,考虑的是最高峰,所以安装12小时算 ,80%的 PV 也就是访问都是在 早上6点到下午6点这12个小时里,晚上6点到早上6点的PV总量是40000 ,服务器台数为3, ...

  4. NodeJS 初体验

    console.log('%s: %d', 'Hello', 25);  // 可以像C语言格式一样输出//app.jsvar http = require('http');http.createSe ...

  5. java利用Scanner获取键盘输入

    首发地址:我的网易博客 在运行一个java程序的时候,可能我们需要在运行的时候传递一些参数进去...咋办呢... java提供了一个Scanner类,利用这个类,我们可以很方便的获取键盘输入的参数.. ...

  6. Freemaker 自定义函数

    定义格式如下: <#function name param1 param2 ... paramN> ... <#return returnValue> ... </#fu ...

  7. linux发行版基础目录

    linux发行版基础目录 linux 基础目录 linux基础目录 目录 作用 / 根目录,起源 /boot linux引导启动目录 /lib 库目录 /bin 常用内部命令 /sbin 常用内部管理 ...

  8. django中css问题

    django中加载的css,js,图片其中js和图片可以加载出来,而css没有效果.原因如下: 这是因为你安装的某些IDE 或者其他更改了注册表导致的系统的注册表\HKEY_CLASSES_ROOT\ ...

  9. spring设置全局异常处理器

    1.spring设置全局异常,它的原理是向上捕获 spring.xml配置 <!--自定义全局异常处理器--> <bean id="globalExceptionResol ...

  10. mysql 查询数据库表结构

    1. mysql> describe tmp_log; +----------+------------------+------+-----+---------+--------------- ...