非常好的一篇文章:

http://webdesigntutsplus.s3.amazonaws.com/tuts/312_bs/My-Bootstrap-Site-NAVBAR/navbar-examples.html

特别注意的是

Static Navbar Full-Width:

Notes & Code

To make a navbar that's positioned static within a page, yet still full-width:

  1. Remove class "navbar-fixed-top" from div class "navbar".
  2. Customize the styles on div class "navbar-inner" to remove rounded corners
  3. It depends ...
    • If you're using Bootstrap 2.02 -->you'll need to modify a line in bootstrap.css. (See code example.)
    • If you're using Bootstrap 2.0 or 2.01 --> you should be good to go!

改变navbar color:

重写.navbar-inner:

http://stackoverflow.com/questions/9869610/navbar-color-in-twitter-bootstrap

bootstrap 导航栏的更多相关文章

  1. BootStrap导航栏的使用

    默认的导航栏 创建一个默认的导航栏的步骤如下: 向 <nav> 标签添加 class .navbar..navbar-default. 向上面的元素添加 role="naviga ...

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

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

  3. Bootstrap -- 导航栏样式、分页样式、标签样式、徽章样式

    Bootstrap -- 导航栏样式.分页样式.标签样式.徽章样式 1. 使用图标的导航栏 使用导航栏样式: <!DOCTYPE html> <html> <head&g ...

  4. Bootstrap导航栏实例讲解

    导航栏是一个很好的功能,是 Bootstrap 网站的一个突出特点.导航栏是响应式元组件就,作为应用程序或网站的导航标题.导航栏在移动设备的视图中是折叠的,随着可用视口宽度的增加,导航栏也会水平展开. ...

  5. Bootstrap导航栏navbar源码分析

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

  6. bootstrap导航栏.nav与.navbar区别

    刚刚看了bootstrap的导航栏,发现有点弄混了,现在来整理一下: 一.简单的ul,li组成的导航: <ul class="nav nav-pills justify-content ...

  7. Bootstrap导航栏

    导航栏: <div id="menu-nav" class="navbar navbar-default navbar-inverse navbar-fixed-t ...

  8. bootstrap导航栏的辛酸史

    昨天本来想完成test10的页面内容的,但是给老铁拉出去打麻将呢.不过还好昨天写了一些内容.现在奉上.不作更改. 今天完成的事情:(实现了test9的响应式导航栏的垂直平分和下拉列表的居中问题.) 我 ...

  9. bootstrap导航栏PC端移动端之不同样式

    在此之前,我先说我之所以要改变网站PC移动双端不同样式的原因. 首先我的网站用到了bootstrap响应式布局,这是我网站的PC端导航栏: 这是我网站的移动端导航栏,看着就难受: 我用谷歌浏览器F12 ...

  10. eclipse Maven Bootstrap 导航栏

    1.在pom.xml添加两个依赖 Bootstrap 依赖和jQuery依赖 代码如下 <!-- https://mvnrepository.com/artifact/org.webjars/b ...

随机推荐

  1. 使用chrome调试xpath

    使用chrome调试xpath 相信玩过爬虫的都知道一些库,如lxml(python),可以使用xpath方便地对HTML进行提取,但当真正用的时候,问题就来了,想找到一个元素往往要调试好几遍,而且得 ...

  2. 【grunt整合版】学会使用grunt打包前端代码

    grunt 是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查 对于其他用法,我还不太清楚,我们这里简单介绍下grunt的压缩.合并文件,初学, ...

  3. codeforces 665D Simple Subset

    题目链接 给一个数列, 让你选出其中的m个数, 使得选出的数中任意两个数之和都为质数, m尽可能的大. 首先, 除了1以外的任意两个相同的数相加结果都不是质数. 然后, 不考虑1的话, 选出的数的个数 ...

  4. 如何彻底卸载sql server 2012

    好不容易装上了sql server 2012数据库,可是却不能连接本地的数据库,后来发现缺少一些服务,于是决定重新安装,但是卸载却很麻烦,如果卸载不干净的话,重新安装会出问题,所以下面就总结一些方法: ...

  5. DLR、ASTER GDEM、SRTM3、GMTED2010等5种全球高程数据对比

      目前网上有多种全球高程数据,国内在这方面也进步喜人,资源三号目前已放出来的卫片给了不少惊喜,其高程数值得期待.但资源三号的高程数据放出来还需等待,过去两三年全球高程数据发展相当迅猛,DLR放出了相 ...

  6. poj 3259 (Bellman_Ford判断负环)

    题意:John的农场里n块地,m条路连接两块地,k个虫洞,虫洞是一条单向路,不但会把你传送到目的地,而且时间会倒退Ts.我们的任务是知道会不会在从某块地出发后又回来,看到了离开之前的自己. 思路:虫洞 ...

  7. [Leetcode][Python]33: Search in Rotated Sorted Array

    # -*- coding: utf8 -*-'''__author__ = 'dabay.wang@gmail.com' 33: Search in Rotated Sorted Arrayhttps ...

  8. codeforces #286 Div.2 C DP总是以意外的方式打败我

    题目大意:30001个岛排成一排,编号从0到30000,一共有n个宝物分散在这些岛上,一只猪最开始从0跳到d,之后每一步跳的步长和上一步相差不超过1,第二步步长就是d-1,d,d+1,第二步的位置就是 ...

  9. javascript数组去重算法-----5

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

  10. S3C6410嵌入式应用平台构建(六)——linux-3.14.4移植到OK6410-(Yaffs2文件制作)

    本文主要讲怎用利用yaffs2工具和busybox制作yaffs2文件系统镜像.大多数都是参照网上的,目的在于记录学习,不做任何用途. 一.制作mkyaffs2image工具 进入yaffs2源码目录 ...