在制作一个基础导航条时,主要分以下几步:

  第一步:首先在制作导航的列表(<ul class=”nav”>)基础上添加类名“navbar-nav”

  第二步:在列表外部添加一个容器(div),并且使用类名“navbar”和“navbar-default”

  “.navbar”样式的主要功能就是设置左右padding和圆角等效果,但他和颜色相关的样式没有进行任何的设置

<div class="navbar navbar-default" role="navigation">
<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系列 -- 38. 基础导航条的更多相关文章

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

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

  2. Bootstrap系列 -- 43. 固定导航条

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

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

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

  4. bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  5. Jquery | 基础 | 导航条在项目中的应用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. Bootstrap系列 -- 11. 基础表单

    表单主要功能是用来与用户做交流的一个网页控件,良好的表单设计能够让网页与用户更好的沟通.表单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等.其中每个控件所起的作用都各 ...

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

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

  8. Bootstrap 固定在顶部导航条

    @{    Layout = null;}<!DOCTYPE html><html><head>    <meta name="viewport&q ...

  9. bootstrap最简单的导航条

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

随机推荐

  1. linux—【绝对路径与相对路径】与【【文件基本操作】】(4)

    [绝对路径与相对路径] 绝对路径:我们在获得一个文件的时候,从根目录到二级到更多级目录都写全了, 终才找到这个文件,这种方式就是“绝对路径” 相对路径:目标文件与我本身文件的相对位置 当前目录:./  ...

  2. 2014年小结之sql语句优化

    之前接手一个数据统计处理的小程序,本来逻辑上并没什么,只是数据量略大,某些表的数据达到了千万级别..因为是统计,所以免不了各种连接各种查询,结果这个小程序写完后运行一次要1个小时..这的确有点出乎意料 ...

  3. jemter的使用(三)

    前面的文章已经把接口请求.响应等前序工作做好,那么如何施加压力呢,看下面 1.点击线程组,设置线程属性,其中:线程数即并发用户数,ramp-up period是多长时间初始化上面的并发用户数,循环次数 ...

  4. IT技术团队管理-总结

    摘要:此文是书籍<行之有效:IT技术团队管理之道>的读书笔记. 主要是方便自己回顾. 您也可以通过此文简要了解此书的内容. 博客: http://www.cnblogs.com/jhzhu ...

  5. linux -- read(), write()

    read()函数 2011-03-23 16:28:37|  分类: linux |  标签: |字号大中小 订阅     read函数从打开的设备或文件中读取数据. #include <uni ...

  6. Codeforces Round #258 E Devu and Flowers --容斥原理

    这题又是容斥原理,最近各种做容斥原理啊.当然,好像题解给的不是容斥原理的方法,而是用到Lucas定理好像.这里只讲容斥的做法. 题意:从n个容器中总共取s朵花出来,问有多少种情况.其中告诉你每个盒子中 ...

  7. HDU 2082 找单词 --生成函数

    跟上题是一个思路:http://www.cnblogs.com/whatbeg/p/3728545.html 只不过是上一题的扩展. 代码: #include <iostream> #in ...

  8. Topcoder SRM 618 Div2 --900

    题意:给定两个NxN的棋盘,每个棋盘都有一个‘车’的摆放状态,问进行若干次交换,能否使棋盘1变为棋盘2. 交换规则:每次选两个‘车’,坐标分别为(r1,c1),(r2,c2),如果r1<r2并且 ...

  9. POJ 3264 Balanced Lineup -- RMQ或线段树

    一段区间的最值问题,用线段树或RMQ皆可.两种代码都贴上:又是空间换时间.. RMQ 解法:(8168KB 1625ms) #include <iostream> #include < ...

  10. JavaScript Promise API

    同步编程通常来说易于调试和维护,然而,异步编程通常能获得更好的性能和更大的灵活性.异步的最大特点是无需等待."Promises"渐渐成为JavaScript里最重要的一部分,大量的 ...