很多情况之一，设计师希望导航条固定在浏览器顶部或底部，这种固定式导航条的应用在移动端开发中更为常见。Bootstrap框架提供了两种固定导航条的方式：

　　 .navbar-fixed-top：导航条固定在浏览器窗口顶部

　　.navbar-fixed-bottom：导航条固定在浏览器窗口底部

<div class="navbar navbar-default navbar-fixed-top" role="navigation">

　…

</div>

<div class="content">我是内容</div>

<div class="navbar navbar-default navbar-fixed-bottom" role="navigation">

　…

</div>

Bootstrap系列 -- 43. 固定导航条的更多相关文章

  1. Bootstrap系列 -- 38. 基础导航条

    在制作一个基础导航条时,主要分以下几步: 第一步:首先在制作导航的列表(<ul class=”nav”>)基础上添加类名“navbar-nav” 第二步:在列表外部添加一个容器(div), ...

  2. bootstrap基础学习【导航条、分页导航】（五）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. Bootstrap系列 -- 37. 基础导航样式

    Bootstrap框架中制作导航条主要通过“.nav”样式.默认的“.nav”样式不提供默认的导航样式,必须附加另外一个样式才会有效,比如“nav-tabs”.“nav-pills”之类.比如右侧代码 ...

  4. Bootstrap 固定导航条

    默认情况下,导航条的定位属性为 static,它的位置由它的HTML代码中定义的顺序出现,并随着页面向下滚动而消失.也可以改变它的定位方式,让它固定显示在浏览器窗口的顶部或底部. 1.固定在顶部 如果 ...

  5. bootstrap学习笔记之导航条基础

    导航条基础 导航条(navbar)和上一节介绍的导航(nav),就相差一个字,多了一个"条"字.其实在Bootstrap框架中他们还是明显的区别.在导航条(navbar)中有一个背 ...

  6. Bootstrap系列 -- 44. 分页导航

    带页码的分页导航,可能是最常见的一种分页导航,特别是在列表页内容超多的时候,会给用户提供分页的导航方式.平时很多同学喜欢用div>a和div>span结构来制作带页码的分页导航.不过,在B ...

  7. bootstrap最简单的导航条

    <nav class="navbar navbar-default navbar-static-top"> <div class="navbar-hea ...

  8. Bootstrap每天必学之导航条

    http://www.jb51.net/article/75534.htm Bootstrap每天必学之导航条,本文向大家讲解了多种多样的导航条,以及导航条中元素的实现方法,感兴趣的小伙伴们可以参考一 ...

  9. 玩转Bootstrap（基础） -- （6.导航条基础）

    1.导航条样例 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" ...

随机推荐

  1. FP并行算法的几个相关方向

    1 集群系统中的 FP-tree 并行算法(many for one一个任务 还是 云计算one for many多个任务?) 计算机集群系统利用网络把一组具有高性能的工作站或者 PC 机按一定的结构 ...

  2. MySQL 调优基础(四) Linux 磁盘IO

    1. IO处理过程 磁盘IO经常会成为系统的一个瓶颈,特别是对于运行数据库的系统而言.数据从磁盘读取到内存,在到CPU缓存和寄存器,然后进行处理,最后写回磁盘,中间要经过很多的过程,下图是一个以wri ...

  3. 关于 redis、memcache mongoDB 的对比

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

  4. Linux磁盘管理之设备文件详解04

    Linux一切接文件,除了普通文件和目录文件,还包括一些其它的特殊文件:块设备文件.字符设备文件.套接字文件.链接文件等.今天这里主要说一下常见的块设备文件和字符设备文件,这2类是最常见的设备文件类. ...

  5. android EditText光标位置(定位到最后)

    方法:edittext.setSelection(int); et.setText(content);//设置EditText控件的内容et.setSelection(content.length() ...

  6. Arch Linux sudo: PAM authentication error: Module is unknown [Solved!]

    问题描述: 我的 Arch Linux 已经用了快半年多,由于 Arch Linux 的滚挂问题,我从没有直接升级过系统.软件版本以及库自然落后了一些. 就在我准备需要用到 NFS 时,挂载网络文件系 ...

  7. shell编程入门

    背景知识 Shell 是用户与内核进行交互操作的一种接口,是 Linux 最重要的软件之一.目前最流行的 Shell 称为 bash Shell,bash Shell 脚本编程以其简洁.高效而著称,多 ...

  8. ios移动端切图及前端规范

    移动端IOS知识普及:IOS标准分辨率:1242px * 2208px 切片要求: 1.    设计稿是按标准分辨率1242X2208设计,图片资源尺寸则是3倍图尺寸,将整个设计图压缩成750X133 ...

  9. z-index堆叠规则

    一.z-index z-index用来控制元素重叠时堆叠顺序. 适用于:已经定位的元素(即position:relative/absolute/fixed). 一般理解就是数值越高越靠上,好像很简单, ...

  10. [转]PLSQL Developer备份恢复oracle数据

    本文转自:http://www.cnblogs.com/iampkm/archive/2013/06/09/3128273.html 使用PL sql提供的功能可以快速的备份恢复oracle数据. 1 ...