分页的状态

下面的实例演示了上表中所讨论的 class .disabled、.active 的用法：

<!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">
<li><a href="#">&laquo;</a></li>
<li class="active"><a href="#">1</a></li>
<li class="disabled"><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历练实例：激活导航状态

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

  2. Bootstrap历练实例：分页的大小

    分页的大小 下面的实例演示了上表中所讨论的 class .pagination-* 的用法: <!DOCTYPE html><html><head><meta ...

  3. Bootstrap历练实例：验证状态

    验证状态 Bootstrap 包含了错误.警告和成功消息的验证样式.只需要对父元素简单地添加适当的 class(.has-warning. .has-error 或 .has-success)即可使用 ...

  4. Bootstrap历练实例：按钮(Button)插件单个切换

    单个切换 如需激活单个按钮的切换(即改变按钮的正常状态为按压状态,反之亦然),只需向 button 元素添加 data-toggle="button" 作为其属性即可,如下面实例所 ...

  5. Bootstrap历练实例：语境色彩的面板

    带语境色彩的面板 使用语境状态类 panel-primary.panel-success.panel-info.panel-warning.panel-danger,来设置带语境色彩的面板,实例如下: ...

  6. bootstrap历练实例： 导航元素中禁用的链接

    对每个 .nav class,如果添加了 .disabled class,则会创建一个灰色的链接,同时禁用了该链接的 :hover 状态, <!DOCTYPE html><html& ...

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

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

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

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

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

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

随机推荐

  1. laravel 报错htmlspecialchars() expects parameter 1 to be string, object given

    翻译过来就是     期望参数1是字符串 意思就是说变量为数组,应以数组的方式输出 @foreach($xxx as $k=>$y) {{$k}}{{$y}} @endforeach

  2. unity3d项目文件目录发布后，对应的ios/android应用目录

    Unity3d的Resource.AssetBundle与手游动态更新的报告,在这里分享一下,希望能够对各位用Unity的朋友有些许帮助.目录:1.Unity的资源数据加载2.Resource.Str ...

  3. su和sudo命令的用法

    为了安全起见,尽量不要用root用户去做所有事情,因为一旦执行了错误的命令,可能会直接导致系统崩溃. 一.su命令 su 命令可以解决切换用户身份的需求,使得当前用户在不退出登录的情况下,切换到其他用 ...

  4. performSegueWithIdentifier:sender里边的sender是啥意思

    performSegueWithIdentifier:sender里边的sender是啥意思啊?怎样用啊? [self performSegueWithIdentifier:@"pushSi ...

  5. echarts相关属性设置（3）环状图

    option = { grid: { left: '3%', top: '0%', // height: 500, right: '30%', containLabel: true, }, legen ...

  6. Java EE规范下载

  7. FMDB存储模型对象（以二进制存储）用NSKeyedArchiver archivedDataWithRootObject序列号，NSKeyedUnarchiver unarchiveObjectWithData反序列化（重点坑是sql语句@"insert into t_newsWithChannel (nwesName,newsType) values (?,?)"）一定要用占位符

    交友:微信号 dwjluck2013 一.封装FMDB单例 (1)JLFMDBHelp.h文件 #import <Foundation/Foundation.h> #import < ...

  8. UG 常用设置

    Q01:UG制图,添加基本视图之后的中心线怎么去掉? A01:“菜单-->文件-->首选项-->制图-->视图-->公共-->常规-->□带中心线创建”,取消 ...

  9. 25 Groovy 相关资料

    Groovy Homepage Groovy API page Groovy documentation Groovy Goodness blog series from Hubert Klein I ...

  10. 使用express+mongoDB搭建多人博客 学习（5）权限控制

    修改index.js如下: var express = require('express'); var router = express.Router(); var crypto=require('c ...