<!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. CF364D Ghd(随机化)

    另一个集合\(s\)的\(ghd\)为\(max\{gcd(s')||s'|>=0.5|s|\}\) 给定序列\(a\),求\(ghd\) 随机化算法.因为\(|s'|\geq 0.5|S|\) ...

  2. PJzhang:robots协议的实际场景

    猫宁!!! 参考链接: https://bbs.360.cn/thread-15062960-1-1.html https://ziyuan.baidu.com/college/courseinfo? ...

  3. C 语言实例 - 删除字符串中的特殊字符

    C 语言实例 - 删除字符串中的特殊字符 C 语言实例 C 语言实例 删除字符串中的除字母外的字符. 实例 #include<stdio.h> int main() { ]; int i, ...

  4. Qt 进程和线程之四:线程实际应用

    为了让程序尽快响应用户操作,在开发应用程序时经常会使用到线程.对于耗时操作如果不使用线程,UI界面将会长时间处于停滞状态,这种情况是用户非常不愿意看到的,我们可以用线程来解决这个问题. 大多数情况下, ...

  5. TYVJ 2032 搜索

    P2032 「Poetize9」升降梯上 描述 开启了升降梯的动力之后,探险队员们进入了升降梯运行的那条竖直的隧道,映入眼帘的是一条直通塔顶的轨道.一辆停在轨道底部的电梯.和电梯内一杆控制电梯升降的巨 ...

  6. Java EE学习笔记(六)

    初识MyBatis 1.MyBatis的定义 1).MyBatis(前身是iBatis)是一个支持普通SQL查询.存储过程以及高级映射的持久层框架. 2).MyBatis框架也被称之为ORM(Obje ...

  7. 《javascript设计模式》笔记之第五章:单体模式

    一:单体的基本结构: 最简单的单体,实际就是一个对象字面量: var Singleton = { attribute1: true, attribute2, method1: function() { ...

  8. 实战:liunx定时清理日志脚本

    参考https://blog.csdn.net/qq_39291929/article/details/79054452 1.需求:我们在 /var/log下面有   EmcsYn.log   和   ...

  9. Java 多态抽象

  10. nodejs express session用法(含保存到redis)

    普通用法: var express = require('express'); var session = require('express-session'); var app = express( ...