向列表组添加自定义内容

我们可以向上面已添加链接的列表组添加任意的 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. Postgresql 10 自带扩展模块功能说明

    adminpackadminpack提供了许多支持功能,pgAdmin 和其他管理和管理工具可以使用它们来提供其他功能,例如远程管理服务器日志文件.所有这些功能的使用仅限于超级用户. citext 该 ...

  2. js框架：angularJs

    AngularJS是一个javascript框架,是一个以JavaScript编写的库,可通过<script>标签添加到HTML页面 AngularJS使得开发现代的单一页面应用程序(SP ...

  3. python爬虫——web前端基础（4）

    CSS,指层叠样式表,用来定义如何显示HTML元素,一般和HTML配合使用. 在HTML中使用CSS样式的方法: 内联样式表:CSS代码直接写在现有的HTML标记中,直接使用style属性改变样式.例 ...

  4. php输出变量加{}的作用

    之前在输出字符串中有变量如 echo “中间有”; echo $i; echo "变量"; 现在发现一个好方法,把变量用{}括起来 echo "中间有{$i}变量&quo ...

  5. 搞定C系语言的的swap

    http://www.cs.utsa.edu/~wagner/CS2213/swap/swap.html 原地址 Parameters, by value and by reference: Both ...

  6. 【poj3764】The xor-longest Path

    The xor-longest Path Description In an edge-weighted tree, the xor-length of a path p is defined as ...

  7. NET Core+MySql+Nginx

    NET Core+MySql+Nginx 容器化部署 .NET Core容器化@Docker.NET Core容器化之多容器应用部署@Docker-Compose.NET Core+MySql+Ngi ...

  8. Linux清空屏幕和清空当前输入的快捷键

    Linux清空屏幕和清空当前输入的快捷键 但是实际上...放弃当前的命令,命令行提示符跳到下一行的有效命令是ctrl + c

  9. C#数据类型 值传递和引用传递

    /// <summary> /// 电脑类 /// </summary> public class Computer { public string Type { get; s ...

  10. mysql 中unsigned

    整型的每一种都分有无符号(unsigned)和有符号(signed)两种类型(float和double总是带符号的),在默认情况下声明的整型变量都是有符号的类型(char有点特别),如果需声明无符号类 ...