请给我一个关于若依权限管理系统的用户管理table样式实例
时间: 2024-04-05 07:33:59 浏览: 21
好的,以下是一个关于若依权限管理系统的用户管理table样式实例:
```html
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>编号</th>
<th>用户名</th>
<th>姓名</th>
<th>性别</th>
<th>邮箱</th>
<th>电话</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>admin</td>
<td>管理员</td>
<td>男</td>
<td>admin@ruoyi.vip</td>
<td>18888888888</td>
<td>
<span class="badge badge-success">正常</span>
</td>
<td>
<a class="btn btn-primary btn-sm" href="#" role="button">编辑</a>
<a class="btn btn-danger btn-sm" href="#" role="button">删除</a>
</td>
</tr>
<tr>
<td>2</td>
<td>test</td>
<td>测试用户</td>
<td>女</td>
<td>test@ruoyi.vip</td>
<td>16666666666</td>
<td>
<span class="badge badge-danger">停用</span>
</td>
<td>
<a class="btn btn-primary btn-sm" href="#" role="button">编辑</a>
<a class="btn btn-danger btn-sm" href="#" role="button">删除</a>
</td>
</tr>
</tbody>
</table>
```
其中,`thead` 表示表头,`tbody` 表示表格主体,`tr` 表示行,`th` 表示表头单元格,`td` 表示普通单元格。在样式上,使用了 Bootstrap 框架提供的样式类,使得表格看起来更加美观。
相关推荐
![.zip](https://img-home.csdnimg.cn/images/20210720083646.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![application/x-rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)