很多情况之一,设计师希望导航条固定在浏览器顶部或底部,这种固定式导航条的应用在移动端开发中更为常见。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. 高效coder,筹备开源框架toutou.escort.js

    背景:JavaScript在工作中运用的非常广泛,作为一门弱类型语言,在使用JavaScript的时候,很多事情需要coder manual的去完成,这无疑增加了coder的工作量. 扩展:在这样的背 ...

  2. pt-diskstats 报错 Can't locate Time/HiRes.pm in @INC

    调用 pt-diskstats 时报错如下Can't locate Time/HiRes.pm in @INC [root@localhost ~]# pt-diskstats Can't locat ...

  3. 使用Fiddler对Android或者iOS设备进行抓包

    1.PC端Fiddler配置 Tools->HTTPS->选中“Decrpt HTTPS traffic”,“Ignore server certificate errors” Tools ...

  4. Jquery:小知识;

    Jquery:小知识: jQuery学习笔记(二):this相关问题及选择器   上一节的遗留问题,关于this的相关问题,先来解决一下. this的相关问题 this指代的是什么 这个应该是比较好理 ...

  5. 精通CSS version2笔记之⒈选择器

    1.常用的选择器:①元素选择器   指定希望应用样式的元素.比如:p {color:#fff;}②后代选择器   寻找特定元素或者元素的后代. 比如:body p{color:#ccc;}   这个选 ...

  6. u3d_shader_surface_shader_3

    参考http://my.oschina.net/u/138823/blog/181131 加了个凹凸贴图: 抱歉把女神苏菲做成这样. 一:Normal Texture的制作: 1.首先是Normal ...

  7. using关键字背后的故事!

    using关键字的作用: 1:可以引入命名空间2:可以释放资源 *****不能使用using语句完全替换掉(try-catch-finally)语句(无法进行异常处理) 在出了using语句的{}后, ...

  8. 渗透攻防工具篇-后渗透阶段的Meterpreter

    作者:坏蛋链接:https://zhuanlan.zhihu.com/p/23677530来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 前言 熟悉Metasploit ...

  9. 对于大量left join 的表查询,可以在关键的 连接节点字段上创建索引。

    对于大量left join 的表查询,可以在关键的 连接节点字段上创建索引. 问题: 大量的left join 怎么优化 select a.id,a.num,b.num,b.pcs,c.num, c. ...

  10. 向数据库中插入一个DateTime类型的数据到一个Date类型的字段中,需要转换类型。TO_DATE('{0}','YYYY-MM-DD'))

    需要指出的是,C#中有datetime类型,但是这个类型是包括小时,分钟,秒的.这个格式与数据库中的Date类型不符,如果将now设为datetime类型插入数据会失败. 需要通过TO_DATE('字 ...