Bootstrap历练实例：向列表组添加链接
向列表组添加链接
通过使用锚标签代替列表项，我们可以向列表组添加链接。我们需要使用 <div> 代替 <ul> 元素。下面的实例演示了这点：
<!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">
<ul class="list-group">
<li class="list-group-item">Html5</li>
<li class="list-group-item">Css3</li>
<li class="list-group-item">Bootstrap</li>
<li class="list-group-item">Javascript</li>
<li class="list-group-item">jQuery</li>
</ul>
<div class="list-group">
<a href="#" class="list-group-item">Html5</a>
<a href="#" class="list-group-item">Css3</a>
<a href="#" class="list-group-item">Bootstrap</a>
<a href="#" class="list-group-item">Javascript</a>
<a href="#" class="list-group-item">jQuery</a>
</div>
<ul class="list-group">
<li class="list-group-item"><a href="#">Html5</a></li>
<li class="list-group-item"><a href="#">Css3</a></li>
<li class="list-group-item"><a href="#">Bootstrap</a></li>
<li class="list-group-item"><a href="#">Javascript</a></li>
<li class="list-group-item"><a href="#">jQuery</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>
最新文章
- Android 打开方式选定后默认了改不回来?解决方法(三星s7为例)
- hdu1695 GCD（莫比乌斯反演）
- tyvj1195 最后的晚餐
- android 利用线程刷新UI方法
- Linux 之 编译器 gcc/g++参数详解
- 判断App是否在后台运行
- 图的强连通&双连通
- Good Numbers
- asp.net mvc5 设置Area下的为启动页
- SCJP_104——题目分析（3）
- 【Android基础】listview控件的使用(3)------Map与SimpleAdapter组成的多显示条目的Listview
- Linux服务器性能指标查询命令安装
- bzoj3713 [PA2014]Iloczyn|暴力（模拟）
- Python 从入门到入门基础练习十五题
- java web--DOM
- python-常见数据类型及其方法
- 2017-2018_OCR_papers汇总
- 论文阅读笔记三十五：R-FCN:Object Detection via Region-based Fully Convolutional Networks（CVPR2016）
- postmain 通过函数动态设置参数
- Python 全栈开发七 面向对象