向列表组添加自定义内容

我们可以向上面已添加链接的列表组添加任意的 HTML 内容。下面的实例演示了这点：

<!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:20px">
<div class="list-group">
<a href="#" class="list-group-item active" ><h2 class="list-group-item-heading">Html5</h2></a>
<a href="#" class="list-group-item"><h2 class="list-group-item-heading">Css3</h2><p class="list-group-item-text">Css3是html5前端必学的技术</p></a>
</div>
</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历练实例：输入框组的大小

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

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

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

  3. Bootstrap历练实例：向列表组添加链接

    向列表组添加链接 通过使用锚标签代替列表项,我们可以向列表组添加链接.我们需要使用 <div> 代替 <ul> 元素.下面的实例演示了这点: <!DOCTYPE html ...

  4. Bootstrap历练实例：默认的列表组

    Bootstrap 列表组 本章我们将讲解列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-grou ...

  5. Bootstrap历练实例：带列表组的面板

    带列表组的面板 我们可以在任何面板中包含列表组,通过在 <div> 元素中添加 .panel 和 .panel-default 类来创建面板,并在面板中添加列表组.您可以从 列表组 一章中 ...

  6. Bootstrap历练实例：带徽章的列表组

    向列表组添加徽章 我们可以向任意的列表项添加徽章组件,它会自动定位到右边.只需要在 <li> 元素中添加 <span class="badge"> 即可.下 ...

  7. Bootstrap历练实例：基本输入框组

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

  8. bootstrap历练实例：复选框或单选按钮作为输入框组的前缀或后缀

    <!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. spring-eureka 源码解读----作为集群的eureka怎么样实现不做二次传播

    在平时工作中,eureka作为一个集群时候,我们会配置多个peer ,假设当前有服务器eureka-A,eureka-B,eureka-C. 如果Eureka A的peer指向了B, B的peer指向 ...

  2. uoj#311. 【UNR #2】积劳成疾（期望dp）

    传送门 果然\(dp\)题就没咱啥事儿了 设\(f_{i,j}\)为长度为\(i\)的区间,所有元素的值不超过\(j\)的总的疲劳值 如果\(j\)没有出现过,那么\(f_{i,j}=f_{i,j-1 ...

  3. Charles使用小结

    charles,抓包神器,记录几个测试过程中常用的功能 连接同一局域网的开发机     域名跳转MapRemoteSetting     抓取Https接口 1.下载3.10以上破解版,按如下步骤安装 ...

  4. C# 流

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  5. Python模块之 sys

    # sys模块是与python解释器交互的一个接口 import sys print(sys.argv) # 命令行参数list,第一个元素是程序本身路径 # (第一个元素就是执行文件的时候,写在py ...

  6. 如果查询的结果少，可以把查询结果当子集，再查另一张表，比join的速度快得多得多

    ) as qty from riv_print_history_l phl JOIN tab_user_profile up on up.UP_USER_ID = phl.PHL_PRINT_USER ...

  7. scrollHelper

    (function ($) { var mouseScroll = function (e) { try { var origEvent = e.originalEvent; origEvent.pr ...

  8. 面向切面编程 （AOP ）的理解

    AOP的全称: Aspact  Oriented  Programming AOP的目标(作用):让我们可以“专心做事”  日志记录,事务处理,异常捕获,缓存操作. AOP原理 将复杂的需求分解出不同 ...

  9. webpack相关插件

    webpack-merge:开发环境和生产环节的webpaak配置文件的配置合并 file-loader:编译写入文件,默认情况下生成文件的文件名是文件名与MD5哈希值的组合 vue-laoder:编 ...

  10. Servlet中的初始化参数、上下文参数、以及@Resource资源注入

    配置初始化参数.上下文参数.以及使用@Resource注解进行资源注入,目的是为了降低代码的耦合度.当项目需求进行变更的时候,不需要反复更改源代码,只需更改web.xml文件即可. 一:Servlet ...