在导航条中添加二级菜单也非常简单

<div class="navbar navbar-default" role="navigation">
 <div class="navbar-header">
  <a href="##" class="navbar-brand">导航条</a>
 </div>
<ul class="nav navbar-nav">
<li class="active"><a href="##">网站首页</a></li>
<li class="dropdown">
<a href="##" data-toggle="dropdown" class="dropdown-toggle">系列教程<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="##">CSS3</a></li>
<li><a href="##">JavaScript</a></li>
<li class="disabled"><a href="##">PHP</a></li>
</ul>
</li>
<li><a href="##">名师介绍</a></li>
<li><a href="##">成功案例</a></li>
<li><a href="##">关于我们</a></li>
</ul>
</div>

Bootstrap系列 -- 40. 导航条二级菜单的更多相关文章

  1. Bootstrap系列 -- 42. 导航条中的按钮、文本和链接

    Bootstrap框架的导航条中除了使用navbar-brand中的a元素和navbar-nav的ul和navbar-form之外,还可以使用其他元素.框架提供了三种其他样式: 1.导航条中的按钮na ...

  2. Bootstrap系列 -- 39. 导航条添加标题

    在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过“navbar-header”和“navbar-brand”来 ...

  3. bootstrap 组件之"导航条"

    一个典型的导航条基本代码如下: <nav class="navbar navbar-default"> <div class="container&qu ...

  4. Bootstrap如何实现导航条?导航条实例详解

    本文主要和大家分享Bootstrap实现导航实例详解,在建设一个网站的时候,不同的页面有很多元素是一样的,比如导航条.侧边栏等,我们可以使用模板的继承,避免重复编写html代码.现在我们打算实现一个在 ...

  5. 1.bootstrap练习笔记-导航条

    bootstrap练习笔记 1.关于导航栏   官网链接:http://v3.bootcss.com/components/#nav 结构大概是这样的: nav标签标识导航栏 class为navbar ...

  6. dedecms织梦导航栏二级菜单的实现方法

    dede导航下拉菜单,一级栏目增加二级下拉菜单   使用dedecms5.6——5.7 将这段代码贴到templets\default\head.htm文件里<!-- //二级子类下拉菜单,考虑 ...

  7. PHPCMS v9 导航显示二级菜单,显示相邻栏目,内容页显示二级栏目

    导航显示二级栏目 <div class="menu">{pc:content action="category" catid="0&quo ...

  8. bootstrap 响应式导航条模板(含下拉菜单,弹出框)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. ecshop简单三部实现导航分类二级菜单

    1.在page_header.lbi对应的位置(你想显示导航的位置)插入 (注意下面的"themes/模板名称/util.php"中的"模板名称"改成你模板文件 ...

随机推荐

  1. 关于 redis、memcache mongoDB 的对比

    from:http://yang.u85.us/memcache_redis_mongodb.pdf 从以下几个维度,对 redis.memcache.mongoDB 做了对比.1.性能都比较高,性能 ...

  2. Java的SPI机制与简单的示例

    一.SPI机制 这里先说下SPI的一个概念,SPI英文为Service Provider Interface单从字面可以理解为Service提供者接口,正如从SPI的名字去理解SPI就是Service ...

  3. 烂泥:SQL Server 2005数据库安装

    本文由秀依林枫提供友情赞助,首发于烂泥行天下. 为了能更好的利用服务器,所以打算把该业务进行迁移.因为该业务比较特殊,需要服务器上有相应的硬件支持,所以打算直接升级该服务器目前的操作系统.目前公司服务 ...

  4. (转)android.intent.action.MAIN与android.intent.category.LAUNCHER

    android.intent.action.MAIN决定应用程序最先启动的Activity android.intent.category.LAUNCHER决定应用程序是否显示在程序列表里 在网上看到 ...

  5. /usr/include/sys/types.h:62: error: conflicting types for ‘dev_t’

    /usr/include/sys/types.h:62: error: conflicting types for ‘dev_t’/usr/include/linux/types.h:13: erro ...

  6. Linux autojump命令

    一.简介 autojump是一个命令行工具,它允许你可以直接跳转到你喜爱的目录,而不用管你现在身在何处. 二.安装 yum install autojump 三.用法 j [目录的名字或名字的一部分] ...

  7. POJ2184 Cow Exhibition[DP 状态负值]

    Cow Exhibition Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 12420   Accepted: 4964 D ...

  8. 查找代码错误.java

    class Other{ public int i; } class Something{ public static oivd main(String[]args){ Other o = new O ...

  9. Android驱动入门-LED--HAL硬件抽象层程序设计①

    硬件平台: FriendlyARM Tiny4412 Cortex-A9 操作系统: UBUNTU 14.04 LTS 时间:2016-09-21  16:15:26 设计HAL硬件抽象层程序,则需要 ...

  10. eclipse的包的加减号展开方式

    这是win7系统下面 导航树的风格 可能你不太习惯 一个最简单的方法: 桌面新建个 eclipse 快捷方式--->右键属性--->兼容性  勾上以兼容模式运行这个程序