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

<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><a href="##">系列教程</a></li>
<li><a href="##">名师介绍</a></li>
<li><a href="##">成功案例</a></li>
<li><a href="##">关于我们</a></li>
</ul>
</div>

Bootstrap系列 -- 39. 导航条添加标题的更多相关文章

  1. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

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

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

  3. Bootstrap系列 -- 40. 导航条二级菜单

    在导航条中添加二级菜单也非常简单 <div class="navbar navbar-default" role="navigation"> < ...

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

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

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

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

  6. bootstrap 组件之"导航条"

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

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

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

  8. Bootstrap系列 -- 26. 下拉菜单标题

    Bootstrap下拉菜单中使用 dropdown-header 来显示菜单标题,和上一篇说道的分割线一样 <div class="dropdown"> <but ...

  9. Bootstrap 手风琴搭配导航条实现常用菜单栏

    效果 HTML代码 <div class="sidebar"> <div class="mc-search"> <div clas ...

随机推荐

  1. oracle表相关

    堆表 数据以堆的形式管理,增加数据时会使用段中找到的第一个能放下数据的自由空间,我们见到的绝大部分的表都是堆表.堆表是数据库的默认表类型. 最简单的情况是 create table test (c1 ...

  2. 设计模式C#实现(三)——外观模式

    外观模式——提供了一个统一的接口,用来访问子系统中的一群接口.外观定义了一个高层接口让子系统更容易使用. 一个外观包含了为许多对象和对他们的操作,使得重复这些操作更方便. 假如客厅里有灯(Lights ...

  3. cordova Process finished with exit code -1

    安装完cordova之后,创建一个测试项目后,运行报Process finished with exit code -1,经过查找原因,是因为gradle没有安装,在http://www.androi ...

  4. find命令中参数perm的用法

    按照文件权限模式用-perm选项,按文件权限模式来查找文件的话.最好使用八进制的权限表示法.如在当前目录下查找文件权限位为755的文件,即文件属主可以读.写.执行,其他用户可以读.执行的文件,可以用: ...

  5. POj3104 Drying(二分)

    Drying Time Limit: 2000MS Memory Limit: 65536K Description It is very hard to wash and especially to ...

  6. windows内核编程之常用数据结构

    1.返回状态 绝大部分的内核api返回值都是一个返回状态,也就是一个错误代码.这个类型为NTSTATUS.我们自己写的函数也大部分这样做. NTSTATUS MyFunction() { NTSTAT ...

  7. 使用Ajax与服务器端通信

    Ajax这个词,不代表任何东西,它仅仅是称呼一系列促进客户端与服务器通信的技术时所用的一个术语.服务器通信时Ajax技术的核心内容,其目标就是从客户端向服务器发送信息,并接受后者的回传,以求在此过程中 ...

  8. 解决客户端通过zookeeper连接到hbase时连接过多的问题

    原因:客户端程序通过zookeeper访问hbase的连接数超过设置的默认链接数(默认数是30),连接数不够用会导致后续的连接连接不上去. 解决办法:设置hbase-site.xml配置文件,添加如下 ...

  9. ZBrush中的Clip剪切笔刷怎么快速运用

    Clip剪切笔刷可以对模型网格进行剪切操作,也可以叫做剪切笔刷.接下来看一下Clip切割笔刷在ZBrush中是如何使用的. 查看更多内容请直接前往:http://www.zbrushcn.com/ji ...

  10. UESTC 1237 质因子分解

    水题一枚.. #include<iostream> #include<cstdio> #include<cstring> #include<cmath> ...