对每个 .nav class，如果添加了 .disabled class，则会创建一个灰色的链接，同时禁用了该链接的 :hover 状态，

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>bootstrap历练实例： 导航元素中禁用的链接</title>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<ul class="nav nav-tabs nav-justified">
<li class="active"><a href="#">Html5</a></li>
<li><a href="#">Css3</a></li>
<li><a href="#">JavaScript</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">jQueryUI</a></li>
<li class="disabled"><a href="#">IOS</a></li>
<li><a href="#">Bootstrap</a></li>
<li><a href="#">C#.Net</a></li>
<li><a href="#">MsSql</a></li>
</ul>
<br /><br /><br />
<ul class="nav nav-pills nav-justified">
<li class="active"><a href="#">Html5</a></li>
<li><a href="#">Css3</a></li>
<li><a href="#">JavaScript</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">jQueryUI</a></li>
<li class="disabled"><a href="#">IOS</a></li>
<li><a href="#">Bootstrap</a></li>
<li><a href="#">C#.Net</a></li>
<li><a href="#">MsSql</a></li>
</ul>
</div>

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

bootstrap历练实例： 导航元素中禁用的链接的更多相关文章

  1. Bootstrap历练实例：向列表组添加链接

    向列表组添加链接 通过使用锚标签代替列表项,我们可以向列表组添加链接.我们需要使用 <div> 代替 <ul> 元素.下面的实例演示了这点: <!DOCTYPE html ...

  2. Bootstrap历练实例：导航中的表单

    Bootstrap历练实例:导航中的表单,它是使用class.navbar-form类,这确保了表单适当的垂直对齐和在较窄的视口中折叠的行为,使用这个对齐方式选项来决定导航栏中的内容放置在哪里. 实例 ...

  3. Bootstrap历练实例：响应式导航栏

    响应式的导航栏 为了给导航栏添加响应式特性,您要折叠的内容必须包裹在带有 classes .collapse..navbar-collapse 的 <div> 中.折叠起来的导航栏实际上是 ...

  4. Bootstrap历练实例：popover插件中的方法

    方法 下面是一些弹出框(Popover)插件中有用的方法: 方法 描述 实例 Options: .popover(options) 向元素集合附加弹出框句柄. $().popover(options) ...

  5. Bootstrap历练实例：激活导航状态

    激活导航状态 您可以在激活状态的胶囊式导航和列表导航中放置徽章.通过使用 <span class="badge"> 来激活链接,如下面的实例所示: <!DOCTY ...

  6. bootstrap历练实例：标签式的导航菜单

    本章将讲解bootstrap提供的用于定义导航元素的一些选项,它使用相同的标签和基类.nav.Bootsrtap也提供了一个用于共享标记和状态的帮助器类.改变修饰的class,可以在不同的样式间进行切 ...

  7. Bootstrap历练实例：表单控件状态(禁用)

    禁用的输入框 input 如果您想要禁用一个输入框 input,只需要简单地添加 disabled 属性,这不仅会禁用输入框,还会改变输入框的样式以及当鼠标的指针悬停在元素上时鼠标指针的样式. < ...

  8. Bootstrap历练实例：响应式导航(带有表单)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  9. Bootstrap历练实例：响应式导航

    <!DOCTYPE html><html lang="zh-cn"><head><meta http-equiv="Conten ...

随机推荐

  1. Codeforces Round #439 (Div. 2)C - The Intriguing Obsession（简单dp）

    传送门 题意 给出三个集合,每个集合的元素数量为a,b,c,现在需要连边,满足集合内元素不可达或最短路为3,求可行方案数 分析 设dp[i][j]为a集合元素为i个,b集合元素为j个的可行方案,易知( ...

  2. memcached连接说明

    memcached 客户端与服务器端通信使用的基于文本的协议,不是二进制,可通过Telnet进行互交

  3. Cocos2d-x-html5之HelloWorld深入分析与调试

    Cocos2d-x-html5之HelloWorld深入分析与调试 另:本章所用Cocos2d-x版本为: Cocos2d-html5-v2.1.1 http://cn.cocos2d-x.org/d ...

  4. Ogre 整体框架入门

    ogre 是面向对象的3d图形引擎. root 是引擎的一个界面类,包含很多快捷的调用其他类的接口. 在ogre中,广泛的使用了单件模式,同时最大的保证了你不需要自己管理资源,除了是你自己new的对象 ...

  5. 常用的高级sql查询

    1.根据主键id数组批量修改 void updateByIdArr(Integer[] idArr); <update id="updateByIdArr" paramete ...

  6. P4463 [国家集训队] calc（拉格朗日插值）

    传送门 设\(dp[i][j]\)为考虑\(i\)个数,其中最大值不超过\(j\)的答案,那么转移为\[dp[i][j]=dp[i-1][j-1]\times i\times j+dp[i][j-1] ...

  7. 毕业N年后，请不要像我一样被档案烦死

    目录 一. 提醒大学生:深刻重视档案,避免以后麻烦! 二.说说我因为档案造成的烦心事! 三.说说档案这档子事: 四.档案如此重要,为什么有些人却成了弃档族? 五.档案该怎么操作才能不当"弃档 ...

  8. java数据结构----队列，优先级队列

    1.队列:和栈中的情况不同,队列中的数据项不总是从数组下标0开始,移除一个数据项后,队头指针会指向下标较高的数据项,其特点:先入先出 2.图解 3.队列的实现代码: 3.1.Queue.java pa ...

  9. Qt 进程和线程之二：启动线程

    Qt提供了对线程的支持,这包括一组与平台无关的线程类.一个线程安全的发送事件的方式,以及跨线程的信号槽的关联.这些使得可以很容易地开发可移植的多线程Qt应用程序,可以充分利用多处理器的机器.多线程编程 ...

  10. LSP5513

    LSP5513:宽范围高效的DC-DC(输入:4.5~27V;输出0.925~24V,3A),输出电流达3A