分页的状态

下面的实例演示了上表中所讨论的 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. IT行业技术及程序员相关网站荟萃

    最近我花了一些时间收集了一些与自己工作相关的常用的网址,由于时间关系,暂时只是收集了这么多,以后有时间再随时添加. 1.程序员网址导航pg265 http://www.pg265.com/TNT程序网 ...

  2. Spring Boot 创建自定义的properties文件

    以IDEA2018为例,在资源文件夹上点击鼠标右键,依次选择 New -> Resource Bundle ,如下图: 在弹出的对话框中,填写properties文件的名称(不用填写.prope ...

  3. Unity3D中常用的数据结构总结与分

    阅读目录 1.几种常见的数据结构 2.几种常见数据结构的使用情景 来到周末,小匹夫终于有精力和时间来更新下博客了.前段时间小匹夫读过一份代码,对其中各种数据结构灵活的使用赞不绝口,同时也大大激发了小匹 ...

  4. C 语言实例 - 将字符串写入文件

    C 语言实例 - 将字符串写入文件 C 语言实例 C 语言实例 将字符串写入文件. 实例 #include <stdio.h> #include <stdlib.h> /* e ...

  5. Zju1610 Count the Colors(lazy标记详解)

    Description 画一些颜色段在一行上,一些较早的颜色就会被后来的颜色覆盖了. 你的任务就是要数出你随后能看到的不同颜色的段的数目.  Input 每组测试数据第一行只有一个整数n, 1 < ...

  6. Log4j2 - java.lang.NoSuchMethodError: com.lmax.disruptor.dsl.Disruptor

    问题 项目使用了log4j2,由于使用了全局异步打印日志的方式,还需要引入disruptor的依赖,最后使用的log4j2和disruptor的版本依赖如下: <dependency> & ...

  7. SpringBoot | Data Access

    https://docs.spring.io/spring-boot/docs/current/reference/html/howto-data-access.html 配置数据源启动器.

  8. ios开发static关键字的理解

    :static关键字修饰局部变量::当static关键字修饰局部变量时,该局部变量只会初始化一次,在系统中只有一份内存 :static关键字不可以改变局部变量的作用域,但是可延长局部变量的生命周期,该 ...

  9. flask_之URL

    URL篇 在分析路由匹配过程之前,我们先来看看 flask 中,构建这个路由规则的两种方法: 通过 @app.route() decorator 通过 app.add_url_rule,这个方法的签名 ...

  10. Codeforces Round #396 (Div. 2) A

    While Mahmoud and Ehab were practicing for IOI, they found a problem which name was Longest common s ...