<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>bootstrap历练实例： 垂直胶囊式的导航菜单</title>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<ul class="nav nav-pills nav-stacked">
<li class="active"><a href="#">Html5</a></li>
<li><a href="#">Css3</a></li>
<li><a href="#">JavaScript</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">jQueryUI</a></li>
<li><a href="#">Bootstrap</a></li>
<li><a href="#">C#.Net</a></li>
<li><a href="#">MsSql</a></li>
</ul>
</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

bootstrap历练实例： 垂直胶囊式的导航菜单的更多相关文章

  1. bootstrap历练实例：标签式的导航菜单

    本章将讲解bootstrap提供的用于定义导航元素的一些选项,它使用相同的标签和基类.nav.Bootsrtap也提供了一个用于共享标记和状态的帮助器类.改变修饰的class,可以在不同的样式间进行切 ...

  2. bootstrap历练实例： 基本胶囊式的导航菜单

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  3. Bootstrap历练实例：响应式导航(带有表单)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  4. Bootstrap历练实例：响应式导航

    <!DOCTYPE html><html lang="zh-cn"><head><meta http-equiv="Conten ...

  5. Bootstrap历练实例：响应式导航栏

    响应式的导航栏 为了给导航栏添加响应式特性,您要折叠的内容必须包裹在带有 classes .collapse..navbar-collapse 的 <div> 中.折叠起来的导航栏实际上是 ...

  6. Bootstrap历练实例：响应式标签页

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  7. Bootstrap历练实例：响应式布局

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  8. Bootstrap历练实例：带有下拉菜单的标签和胶囊导航

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  9. Bootstrap历练实例：激活导航状态

    激活导航状态 您可以在激活状态的胶囊式导航和列表导航中放置徽章.通过使用 <span class="badge"> 来激活链接,如下面的实例所示: <!DOCTY ...

随机推荐

  1. C++中拷贝构造函数

    C++中拷贝构造函数 1.什么是拷贝构造函数: 拷贝构造函数嘛,当然就是拷贝和构造了.(其实很多名字,只要静下心来想一想,就真的是顾名思义呀)拷贝又称复制,因此拷贝构造函数又称复制构造函数.百度百科上 ...

  2. jade安装及基本语法使用

    一.cmd安装jade: cnpm install -g jade //cnom install jade -g与上面使用效果一致. 二.jade命令行中使用: 使用cmd: jade index.j ...

  3. laravel 安装配置前准备

    Laravel 框架使用 Composer 来管理其依赖性.所以,在你使用 Laravel 之前,你必须在你电脑上是否安装了 Composer.最简单的获取Composer的方式就是百度之,百度关键字 ...

  4. 渲染路径-实时渲染中常用的几种Rendering Path

    http://www.cnblogs.com/polobymulberry/p/5126892.html?utm_source=tuicool&utm_medium=referral 回到顶部 ...

  5. web前端篇：JavaScript基础篇（易懂小白上手快）-1

    目录 详细内容: 0.JavaScript的引入 1.第一个JavaScript 2.变量 3.变量的类型 4.数组 5.条件语句 6.三元运算符 7.循环 8.函数 9.对象(object): 10 ...

  6. Pycharm2018.3.1永久激活

    Pycharm Professional 2018.3.1 版已正式发布,新版本添加对Python3.7的支持.作为强大的开发工具,但每次注册让人头疼,本着分享的心态,提供以下解决方案,亲测有效!本方 ...

  7. C 语言实例 - 计算 int, float, double 和 char 字节大小

    C 语言实例 - 计算 int, float, double 和 char 字节大小 C 语言实例 C 语言实例 使用 sizeof 操作符计算int, float, double 和 char四种变 ...

  8. python模块之struct

    # #********struct模块********# # 1.按照指定格式将Python数据转换为字符串,该字符串为字节流,如网络传输时, # 不能传输int,此时先将int转化为字节流,然后再发 ...

  9. java算法之冒泡排序

    所有的冒泡排序算法都是一样的: 冒泡排序可以分为两种情况: 一种是将无序序列排序为由小到大的升序方式: 另一种情况是将无序序列转化成一种由大到小的降序排列:

  10. 命令行视频下载工具 you-get 和 youtube-dl

    you-get 和 youtube-dl 都是基于 Python 的命令行媒体文件下载工具,完全开源免费跨平台.用户只需使用简单命令并提供在线视频的网页地址即可让程序自动进行嗅探.下载.合并.命名和清 ...