将 HTML 内容添加到 Bootstrap 列表组
使用 list-group-item 类添加引导列表组。
使用以下代码将 HTML 内容添加到链接列表组
示例
<!DOCTYPE html><html>
<head>
<title>Bootstrap Example</title>
<link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
<script src = "/scripts/jquery.min.js"></script>
<script src = "/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class = "list-group">
<a href = "#" class = "list-group-item active">
<h4 class = "list-group-item-heading">
Tutorials
</h4>
</a>
<a href = "#" class = "list-group-item">
<h4 class = "list-group-item-heading">
Programming
</h4>
<p class = "list-group-item-text">
Tutorials on Java, C, C++, etc.
</p>
</a>
<a href = "#" class = "list-group-item">
<h4 class = "list-group-item-heading">
Web Development
</h4>
<p class = "list-group-item-text">
Tutorials on PHP, HTML5, etc.
</p>
</a>
<a href = "#" class = "list-group-item">
<h4 class = "list-group-item-heading">
Database
</h4>
<p class = "list-group-item-text">
Tutorials on DBMS, MySQL, DB2, etc.
</p>
</a>
</div>
<div class = "list-group">
<a href = "#" class = "list-group-item active">
<h4 class = "list-group-item-heading">
Quiz
</h4>
</a>
<a href = "#" class="list-group-item">
<h4 class = "list-group-item-heading">
CAT
</h4>
<p class = "list-group-item-text">
Quiz for CAT students.
</p>
</a>
<a href = "#" class = "list-group-item">
<h4 class = "list-group-item-heading">NEET</h4>
<p class = "list-group-item-text">Quiz for NEET students.</p>
</a>
</div>
</body>
</html>
以上是 将 HTML 内容添加到 Bootstrap 列表组 的全部内容, 来源链接: utcz.com/z/352709.html