1. 标签页

  .nav添加.nav-tabs设计标签页,.nav-tabs 依赖 .nav 基类。

1.1 示例代码

<ul class="nav nav-tabs">
<li class="active"><a href="#">首页</a></li>
<li><a href="#">个人设置</a></li>
<li><a href="#">消息中心</a></li>
</ul>

1.2 示例效果

2. 胶囊式标签页

  .nav添加.nav-pills设计胶囊式标签页

2.1 示例代码

<ul class="nav nav-pills">
<li class="active"><a href="#">首页</a></li>
<li><a href="#">个人设置</a></li>
<li><a href="#">消息中心</a></li>
</ul>

2.2 示例效果

3. 胶囊式标签页垂直排列

  在<ul class="nav nav-pills">添加.nav-stacked设计胶囊式标签页垂直排列。

3.1 示例代码

<ul class="nav nav-pills nav-stacked">
<li class="active"><a href="#">首页</a></li>
<li><a href="#">个人设置</a></li>
<li><a href="#">消息中心</a></li>
</ul>

3.2 示例效果

Bootstrap3系列:导航的更多相关文章

  1. 【开源】OSharp框架解说系列(1):总体设计及系列导航

    系列文章导航 [开源]OSharp框架解说系列(1):总体设计 [开源]OSharp框架解说系列(2.1):EasyUI的后台界面搭建及极致重构 [开源]OSharp框架解说系列(2.2):EasyU ...

  2. linq入门系列导航

    写在前面 为什么突然想起来学学linq呢?还是源于在跟一个同事聊天的时候,说到他们正在弄得一个项目,在里面用到了linq to sql.突然想到距上次使用linq to sql是三年前的事情了.下班回 ...

  3. C#编程基础->XML系列导航

    缘由 最近开发的小程序过程中需要涉及到XML相关操作,突然发现自己对于这知识点了解的太少,急需学习加强.刚好项目的时间也不是很紧急,自己就总结XML相关知识点.一个方面自己学习,一个方面也希望可以帮到 ...

  4. 【转】Oracle系列导航目录

    .Net程序员学用Oracle系列(1):导航目录 .Net程序员学用Oracle系列(2):准备测试环境 .Net程序员学用Oracle系列(3):数据库编程规范 .Net程序员学用Oracle系列 ...

  5. MVC5 + EF6 + Bootstrap3系列教程

    本系列教程以ASP.NET MVC5为核心框架,使用Entity Framewok6访问数据,并使用Bootstrap3作为前端UI框架.帮助大家开发出一套高效.美观.稳定.实用的软件系统. MVC5 ...

  6. MvvmLight学习篇—— Mvvm Light Toolkit for wpf/silverlight系列(导航)

    系列一:看的迷迷糊糊的 一.Mvvm Light Toolkit for wpf/silverlight系列之准备工作 二.Mvvm Light Toolkit for wpf/silverlight ...

  7. Bootstrap3系列:输入框组

    1. 基本实例 通过在文本输入框 <input> 前面.后面或是两边加上文字或按钮,实现对表单控件的扩展. .input-group包含.input-group-addon给 .form- ...

  8. Bootstrap3系列:按钮式下拉菜单

    1. 基本实例 把按钮放入 .btn-group 中,加入适当的菜单标签,让按钮触发下拉菜单. 1.1 示例代码 <div class="btn-group"> < ...

  9. Bootstrap3系列:按钮组

    1. 基本实例 1.1 示例代码 <div class="btn-group"> <button type="button" class=&q ...

随机推荐

  1. 简谈百度坐标反转至WGS84的三种思路

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景 基于百度地图进行数据展示是目前项目中常见场景,但是因为百度地图 ...

  2. 深入浅出Redis-redis底层数据结构(上)

    1.概述 相信使用过Redis 的各位同学都很清楚,Redis 是一个基于键值对(key-value)的分布式存储系统,与Memcached类似,却优于Memcached的一个高性能的key-valu ...

  3. Security Policy:行级安全(Row-Level Security)

    行级安全RLS(Row-Level Security)是在数据行级别上控制用户的访问,控制用户只能访问数据库表的特定数据行.断言是逻辑表达式,在SQL Server 2016中,RLS是基于安全断言( ...

  4. redux-undo

    简介 通过包装reducer,创建一个state History,保留历史state,可以做退一步,进一步操作 1.install npm install --save redux-undo@beta ...

  5. ASP.NET Core 1.0 开发记录

    官方资料: https://github.com/dotnet/core https://docs.microsoft.com/en-us/aspnet/core https://docs.micro ...

  6. Mysql存储引擎比较

    Mysql作为一个开源的免费数据库,在平时项目当中会经常使用到,而在项目当中我们的着重点一般在设计使用数据库上而非mysql本身上,所以在提到mysql的存储引擎时,一般都不曾知道,这里经过网上相关文 ...

  7. Javascript实现HashTable类

    散列算法可以尽快在数据结构中找出指定的一个值,因为可以通过Hash算法求出值的所在位置,存储和插入的时候都按照Hash算法放到指定位置. <script> function HashTab ...

  8. C++随笔:.NET CoreCLR之GC探索(4)

    今天继续来 带大家讲解CoreCLR之GC,首先我们继续看这个GCSample,这篇文章是上一篇文章的继续,如果有不清楚的,还请翻到我写的上一篇随笔.下面我们继续: // Initialize fre ...

  9. Android开发学习——画横线竖线

    画横线/竖线 竖线 <View android:layout_width="1dp" android:layout_height="match_parent&quo ...

  10. 敏捷转型历程 - Sprint3 Grooming

    我: Tech Leader 团队:团队成员分布在两个城市,我所在的城市包括我有4个成员,另外一个城市包括SM有7个成员.另外由于我们的BA离职了,我暂代IT 的PO 职位.PM和我在一个城市,但他不 ...