非常好的一篇文章:

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. 对于windows窗口的标题菜单栏的操作——删除/禁用 最小最大话和关闭

    HWND hand = FindWindow(NULL, "计算器"); int nStyle = GetWindowLong(hand, GWL_STYLE);nStyle &a ...

  2. CentOS 6下配置本地用户访问vsftpd并赋予写权限

    一.安装并测试可用性 1.安装命令 yum install vsftpd 2.配置防火墙,加入一行 -A INPUT -p tcp -m tcp --dport 21 -j ACCEPT 在其它机测试 ...

  3. php的页面缓存练习

    <?php /* * 自定义页面缓存类 */ namespace page_cache; class Page { public $CacheRoot = "pageCache/&qu ...

  4. CPU核心数

    Process.ProcessorAffinity 属性: public IntPtr ProcessorAffinity { get; set; }属性值:位掩码,表示关联进程内的线程可以在其上运行 ...

  5. 基于蓝牙4.0(Bluetooth Low Energy)胎压监测方案设计

    基于一种新的蓝牙技术——蓝牙4.0(Bluetooth Low Energy)新型的胎压监测系统(TPMS)的设计方案.鉴于蓝牙4.0(Bluetooth Low Energy)的低成本.低功耗.高稳 ...

  6. 十九、Android Activity初探

    原文:十九.Android Activity初探 Activity是一个应用中的组件,它为用户提供一个可视的界面,方便用户操作,比如说拔打电话.照相.发邮件或者是浏览地图等.每个activity会提供 ...

  7. GDKOI2015 Day1

    P1 题目描述: 判断一个环形字符串(或者减去一个字符之后)是否是回文串 solution: 1.hash 将字符串的前缀进行hash,然后将字符串翻转,再做一次hash,然后枚举对称轴,判断两边的h ...

  8. iOS6和iOS7代码的适配(4)——tableView

    iOS7上不少控件的样子有了变化(毕竟要扁平化嘛),不过感觉变化最大的肯定非tableView莫属.因为这个控件的高度可定制性,原先是使用及其广泛的,这样的一个改变自然也影响颇大. 1.accesso ...

  9. 解决android开发webservice的发布与数据库连接的问题

    由于app后续开发的需要,移植了两次webservice和数据库,遇到了不少问题,也花费了很多时间,实践告诉我要学会寻找问题的根源,这样才能在开发中节省时间,尽快解决问题!好,废话不多说,转入正题…… ...

  10. ntpd和ntpdate的区别

    之前配置ntpd的时候搜到一句话,印象很深刻,也觉得很有标题党的效果,就借鉴为标题了:“我认为有几种人是必须不招聘/裁掉的: 1 用ntpdate代替ntpd的人”但具体原因不太懂,总觉得还是用ntp ...