<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>表格</title>
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
<style>
body {
padding: 20px;
}
</style>
</head>
<body>
<!--<table class="table">-->
<table class="table table-striped"> 让<tbody>里的行产生一行隔一行加单色背景效果
<table class="table table-bordered">给表格增加边框
<table class="table table-hover table-bordered"> 让<tbody>下的表格悬停鼠标实现背景效果
<!-- 表头 -->
<thead>
<th>标题</th>
<th>标题</th>
<th>标题</th>
</thead>
<tbody>
<tr>
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
<tr class="success">
<!--标识 成功或者积极的动作-->
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
<tr class="active">
<!--鼠标悬停在行或单元格上-->
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
<tr class="info">
<!--标识普通的提示信息或动作-->
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
<tr class="warning">
<!--标识警告或需要用户注意-->
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
<tr class="danger">
<!--表示危险或潜在的带来负面影响的动作-->
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
<tr class="sr-only">
<!--隐藏某一行-->
<td>基本表格样式</td>
<td>基本表格样式</td>
<td>基本表格样式</td>
</tr>
</tbody>
</table>
</body>
</html>
106
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
