运行截图：
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>人员管理列表</title>
<link rel="stylesheet" href="../bootstrap/css/bootstrap.css">
</head>
<body>
<div class="container">
<h3 class="text-center my-3">人员信息表</h3>
<div class="clearfix mb-2">
<div class="py-2 float-left">
<form action="" class="form-inline">
<div class="dropdown btn-group">
<button class="btn btn-secondary" type="button">请选择项目</button>
<button class="btn btn-success dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" data-offset="-105,0" type="button"></button>
<div class="dropdown-menu">
<a href="#" class="dropdown-item">option1</a>
<a href="#" class="dropdown-item">option2</a>
<a href="#" class="dropdown-item">option3</a>
</div>
</div>
<div class="form-group ml-2">
<input type="search" class="form-control">
<button class="btn btn-info" type="submit">搜索</button>
</div>
</form>
</div>
<div class="py-2 float-right">
<div class="ml-auto btn-group">
<button class="btn btn-primary">add</button>
<button class="btn btn-info">update</button>
<button class="btn btn-danger">delete</button>
<button class="btn btn-success">actior</button>
</div>
</div>
</div>
<div class="row tbbody">
<table class="table table-bordered table-hover">
<thead class="table-success">
<tr>
<th class="w-5"><input type="checkbox"></th>
<th class="w-15">人员ID</th>
<th class="w-15">名称</th>
<th class="w-5">性别</th>
<th class="w-5">年龄</th>
<th class="w-50">简介</th>
</tr>
</thead>
<tbody>
<tr>
<td class="w-5"><input type="checkbox" name="" id=""></td>
<td class="w-15">123455</td>
<td class="w-15">zs</td>
<td class="w-5">sex</td>
<td class="w-5">25</td>
<td class="w-50">this is a body</td>
</tr>
<tr>
<td class="w-5"><input type="checkbox" name="" id=""></td>
<td class="w-15">1233242455</td>
<td class="w-15">zgsees</td>
<td class="w-5">sex</td>
<td class="w-5">25</td>
<td class="w-50">this is a body</td>
<tr>
<td class="w-5"><input type="checkbox" name="" id=""></td>
<td class="w-15">123433355</td>
<td class="w-15">zdgses</td>
<td class="w-5">sex</td>
<td class="w-5">25</td>
<td class="w-50">this is a body</td>
</tr>
<tr>
<td class="w-5"><input type="checkbox" name="" id=""></td>
<td class="w-15">1242423455</td>
<td class="w-15">zdaads</td>
<td class="w-5">sex</td>
<td class="w-5">25</td>
<td class="w-50">this is a body</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
<!--引入js文件-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
<!--Bootstrap核心JavaScript文件-->
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.4.1/js/bootstrap.min.js"></script>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
