请你用bootStrap绘制一张表格,对商品的分类进行增伤改查,商品分为大类和小类,商品的小类属于商品的大类
时间: 2023-06-06 14:04:19 浏览: 61
好的,以下是使用Bootstrap绘制的商品分类增删改查表格代码示例:
```
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>商品分类管理系统</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h1 class="text-center my-4">商品分类管理系统</h1>
<table class="table table-bordered table-striped mt-4">
<thead>
<tr>
<th>编号</th>
<th>名称</th>
<th>大类</th>
<th>小类</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>商品1</td>
<td>大类1</td>
<td>小类1</td>
<td>
<button class="btn btn-info">编辑</button>
<button class="btn btn-danger">删除</button>
</td>
</tr>
<tr>
<td>2</td>
<td>商品2</td>
<td>大类1</td>
<td>小类2</td>
<td>
<button class="btn btn-info">编辑</button>
<button class="btn btn-danger">删除</button>
</td>
</tr>
<tr>
<td>3</td>
<td>商品3</td>
<td>大类2</td>
<td>小类3</td>
<td>
<button class="btn btn-info">编辑</button>
<button class="btn btn-danger">删除</button>
</td>
</tr>
</tbody>
</table>
<div class="d-flex justify-content-end">
<button class="btn btn-success">新增</button>
</div>
</div>
<script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
</body>
</html>
```
注意:以上代码只是示例,需要根据实际需求进行调整。具体实现细节可以参考Bootstrap官方文档。