分页的大小

下面的实例演示了上表中所讨论的 class .pagination-* 的用法：

<!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="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div style="padding:150px">
<ul class="pagination pagination-lg">
<li><a href="#">&laquo;</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">6</a></li>
<li><a href="#">&raquo;</a></li>
</ul>
<br /><br />
<ul class="pagination">
<li><a href="#">&laquo;</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">6</a></li>
<li><a href="#">&raquo;</a></li>
</ul><br /><br />
<ul class="pagination pagination-sm">
<li><a href="#">&laquo;</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">6</a></li>
<li><a href="#">&raquo;</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历练实例：大小Well

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

  2. Bootstrap历练实例：分页状态

    分页的状态 下面的实例演示了上表中所讨论的 class .disabled..active 的用法: <!DOCTYPE html><html><head>< ...

  3. Bootstrap历练实例：输入框组的大小

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

  4. Bootstrap历练实例：按钮组大小

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

  5. Bootstrap历练实例：表单控件大小

    表单控件大小 您可以分别使用 class .input-lg 和 .col-lg-* 来设置表单的高度和宽度. 实例: <!DOCTYPE html><html><hea ...

  6. Bootstrap历练实例：轮播(carousel)

    <!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 lang="zh-cn"><head><meta http-equiv="Conten ...

  9. Bootstrap 历练实例-轮播(carousel)插件的事件

    事件 下表列出了轮播(Carousel)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 slide.bs.carousel 当调用 slide 实例方法时立即触发该事件. $(' ...

随机推荐

  1. Android教程

    转载,但请务必在明确位置注明出处! http://stormzhang.com/android/2014/07/07/learn-android-from-rookie/ Android Killer ...

  2. caller和callee的解析与使用-型参与实参的访问

    caller:是一个函数引用(当前执行函数”被调用的地方”{即这个”被调用的地方”函数引用},如果这个”被调用的地方”是window,则返回[null]),是函数名的属性: var a = funct ...

  3. 2014-5-10 NOIP模拟赛 by coolyangzc

    Problem 1 机器人(robot.cpp/c/pas) [题目描述] 早苗入手了最新的Gundam模型.最新款自然有着与以往不同的功能,那就是它能够自动行走,厉害吧. 早苗的新模型可以按照输入的 ...

  4. C 语言实例 - 计算平均值

    C 语言实例 - 计算平均值 C 语言实例 C 语言实例 使用数组来计算几个数的平均值. 实例 #include <stdio.h> int main() { int n, i; ], s ...

  5. 线程安全 原子性 可见性 顺序性 volatile

  6. JS面向对象方法（二） 面向对象方法实现橱窗式图面预览以及放大功能

     效果图: HTML结构如下: <div id="preview"> <div id="mediumDiv"> <img id=& ...

  7. Dwarves, Hats and Extrasensory Abilities Codeforces - 1063C

    https://codeforces.com/contest/1063/problem/C 首先可以想到一个简单做法:先钦定这个直线的斜率k=-1,然后设直线y=-x+b 设黑点放直线上方:如果已知( ...

  8. Arch Linux 安装记（安装到移动硬盘）

    一转眼传说中装起来难于上青天,用起来险如上刀梯(容易滚挂),绰号“洗发水”并被戏称为“邪教”的 Arch Linux 已经用了几个月.某些关于其安装难度和稳定性的传说实在太夸张了,反而觉得这才是适合懒 ...

  9. WebView使用遇到的坑

    1.为了防止内存泄漏,关闭界面的时候一定要记得 webView.distroy()  并且把webView置为null 2.尽量不要在代码中new控件 尽量不要在代码中new控件  尽量不要在代码中n ...

  10. 使用em和rem替代px

    rem是指根元素的字体大小,默认情况下html的字体大小为:16px=1rem.而em是相对单位,是基于它的祖先元素计算的. 如果我们不指定html和body的字体大小,要得到12px的rem需要这样 ...