BootStrap2学习日记15----选项卡
导航格式1:
<ul class="nav nav-tabs">
<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>
效果1:

导航格式2:
<ul class="nav nav-tabs nav-stacked">
<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>
效果2:

选项卡格式3:
<ul class="nav nav-pills ">
<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>
效果3:

在ul 的 class 中加入 nav-stacked 效果如下:

BootStrap2学习日记15----选项卡的更多相关文章
- BootStrap2学习日记16---选项卡内容
代码: <ul class="nav nav-tabs"> <li class="active"><a href="#t ...
- BootStrap2学习日记3--响应式布局实用类
BootStrap2中常用的响应式布局类如: visible-phone 仅在 手机平台显示 visible-tablet 仅在 平板电脑显示 visible-desktop 仅 ...
- BootStrap2学习日记2--将固定布局换成响应式布局
概要:响应式页面是指页面根据浏览平台(尺寸)的不同显示不同的CSS. 原理:在Html的的头加入代码 <style> /*当浏览器宽度大于767是 采用括号里面的CSS样式*/ @medi ...
- BootStrap2学习日记23---图片轮播
<div id="carousel1" class="carousel slide"> <div class="carousel-i ...
- BootStrap2学习日记22---点击展开
先看效果: Code: <div class="accordion" id="accordion2"> <div class="ac ...
- BootStrap2学习日记21---消息提示
<p><a href="#" title="中国(China),位于东亚,是一个以华夏文明为主体.中华文化为基础,以汉族为主要民族的统一多民族国家,通用 ...
- BootStrap2学习日记20---定制缩略图
先看看效果: 代码: <ul class="thumbnails"> <li class="span3"> <div class= ...
- BootStrap2学习日记19---缩略图
缩略图 代码: <ul class="thumbnails"> <li class="span3"><a href="# ...
- BootStrap2学习日记18---提示消息
代码: <div class="alert alert-block" id="alert"> <a href="#" cl ...
随机推荐
- Fedora 14 x64 试用手记
欢迎大家给我投票: http://2010blog.51cto.com/350944 刊登在: http://os.51cto.com/art/201011/235506.htm FC14桌面使用体验 ...
- HD2086A1 = ?
Problem Description 有如下方程:Ai = (Ai-1 + Ai+1)/2 - Ci (i = 1, 2, 3, .... n). 若给出A0, An+1, 和 C1, C2, .. ...
- Working with Other Node Types II
[Working with Other Node Types II] An SKCropNode object does not directly render content, like a spr ...
- [iOS微博项目 - 3.1] - 发微博界面
github: https://github.com/hellovoidworld/HVWWeibo A.发微博界面:自定义UITextView 1.需求 用UITextView做一个编写微博的输 ...
- GetQueuedCompletionStatus的返回值
完成端口GetQueuedCompletionStatus返回值的问题 先看看GetQueuedCompletionStatus函数的完整声明:BOOL GetQueuedCompletionStat ...
- F5 会话保持
1.什么是会话保持?在大多数电子商务的应用系统或者需要进行用户身份认证的在线系统中,一个客户与服务器经常经过好几次的交互过程才能完成一笔交易或者是一个请求的完成.由于这几次交互过程是密切相关的,服务器 ...
- JAVA自定义注释(Target,Retention,Documented,Inherit)
java自定义注解 Java注解是附加在代码中的一些元信息,用于一些工具在编译.运行时进行解析和使用,起到说明.配置的功能.注解不会也不能影响代码的实际逻辑,仅仅起到辅助性的作用.包含在 java.l ...
- Spring REST实践之Spring Web MVC
Spring概要 Spring Framework提供了依赖注入模型和面向切面编程,简化了基础型代码的编写工作以及更好的能够与其它框架和技术整合起来.Spring Framework由data acc ...
- Visual Studio无法添加断点
今天在写代码的时候突然发现无法添加断点,更加详细的场景是“按F9可以添加调试行,但是断点不显示,且显示代码行数左边的灰色区域不见了”找了各种方法也没有解决,然后重启.修复甚至重装都不行,最后在万千网页 ...
- 如何在使用了updatepanel后弹出提示信息
转载:http://www.cnblogs.com/brusehht/archive/2009/03/19/1416802.html 常情况下,我们在使用ajax利用updatepanel实现页面局部 ...