Bootstrap历练实例：分页的大小
分页的大小
下面的实例演示了上表中所讨论的 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="#">«</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="#">»</a></li>
</ul>
<br /><br />
<ul class="pagination">
<li><a href="#">«</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="#">»</a></li>
</ul><br /><br />
<ul class="pagination pagination-sm">
<li><a href="#">«</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="#">»</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历练实例：分页的大小的更多相关文章
- Bootstrap历练实例：大小Well
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap历练实例：分页状态
分页的状态 下面的实例演示了上表中所讨论的 class .disabled..active 的用法: <!DOCTYPE html><html><head>< ...
- Bootstrap历练实例：输入框组的大小
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap历练实例：按钮组大小
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap历练实例：表单控件大小
表单控件大小 您可以分别使用 class .input-lg 和 .col-lg-* 来设置表单的高度和宽度. 实例: <!DOCTYPE html><html><hea ...
- Bootstrap历练实例：轮播(carousel)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap历练实例：响应式导航(带有表单)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap历练实例：响应式导航
<!DOCTYPE html><html lang="zh-cn"><head><meta http-equiv="Conten ...
- Bootstrap 历练实例-轮播(carousel)插件的事件
事件 下表列出了轮播(Carousel)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 slide.bs.carousel 当调用 slide 实例方法时立即触发该事件. $(' ...
随机推荐
- hihocoder #1335 : Email Merge（map+sort）
传送门 题意 分析 每次插入人名与邮箱的时候,做一次并查集,然后做一次sort即可 trick 3 a 1 first@hihocoder.com b 1 second@hihocoder.com c ...
- 【OpenJ_Bailian - 2287】Tian Ji -- The Horse Racing （贪心）
Tian Ji -- The Horse Racing 田忌赛马,还是English,要不是看题目,我都被原题整懵了,直接上Chinese吧 Descriptions: 田忌和齐王赛马,他们各有n匹马 ...
- sed 匹配\n换行符
假设 str="a,b,c,d" echo ${str} | sed "s/,/\n/g" 输出: a b c d echo ${str} | sed &quo ...
- 第一篇 Nosql讲解之Redis，Memchche,MongoDb的区别
本篇文章主要介绍Nosql的一些东西,以及Nosql中比较火的三个数据库Redis.Memchache.MongoDb和他们之间的区别.以下是本文章的阅读目录 一.Nosql介绍 1.Nosql简介 ...
- Windows服务使用Windsor容器
该文章是系列文章 基于.NetCore和ABP框架如何让Windows服务执行Quartz定时作业 的其中一篇. Windsor是ABP框架自带的IOC容器. 关于什么是IOC,你可以Bing或者Go ...
- AOP 应用
AOP 的核心:解耦 1. 权限认证2. 事务3. 日志4. Lazy loading 懒加载5. Context Process 上下文处理6. Error Handler 错误追踪(异常捕获)7. ...
- [题解]（最短路）luogu_P5122 Fine Dining
首先理解这里的美味值相当于给你更多时间让你经过这个草垛的, 也就是在经过草垛时可以给你的时间减少w[i],这样能否比最短路不慢 然而我们并不容易知道怎么走才是最好的,所以要想办法避免找这个方案 我们新 ...
- 如何实现序列化为json
因为需要观察对象的数据,所以寻找能自动描述对象中字段名和其值的描述类,咨询了不少人,都推荐使用json,但是json使用起来有一点额外的操作. 需要在文件中引用 using System.Web.Sc ...
- 使用express+mongoDB搭建多人博客 学习（1） 安装blog工程
一.安装 1.安装express npm install -g expressnpm install -g express-generator 2.用ejs做模板,新建blog工程express -e ...
- Java微信公众平台开发(八)--多媒体消息回复之音乐
我们上一篇写了关注出发图片的回复.想着在发送一次音乐,最后基于回复消息分类情况下,实现一个简单的只能话回复.先附一张大致效果图. 下面我们进入代码阶段. (一)修改消息转发器MsgDispatcher ...