修改文件,应用第一个样式:
其中样式文件:
goods2.css中的内容
.a1{
margin-top: 30px;
}
完整html文件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>商品管理</title>
<link rel="stylesheet" href="css/goods2.css" />
</head>
<body>
<div >您当前的位置是:商品管理</div>
<hr>
<div class="a1">
<div >商品管理</div>
<div class="a1">
<span>商品名称</span>
<input type="text" />
<input type="button" value="查询" style="width: 100px;"/>
</div>
<div class="a1">
<input type="button" style="width: 150px;" value="选择文件" />
<span>请选择文件</span>
<input type="button" style="width: 150px;" value="导入商品" />
<input type="button" style="width: 150px;" value="手动添加" />
</div>
</div>
<div class="a1">
<table>
<th>
<thead>
<tr>
<td>商品标示ID</td>
<td>生产商名称</td>
<td>生产商ID</td>
<td>商品名称</td>
<td>重量</td>
<td>审核</td>
<td>操作</td>
</tr>
</thead>
</th>
<tbody>
<tr>
<td>1</td>
<td>海尔集团</td>
<td>manid00123</td>
<td>洗衣机</td>
<td>30公斤</td>
<td>通过</td>
<td><input type="button" value="查看"><input type="button" value="编辑"><input type="button" value="删除"></td>
</tr>
<tr>
<td>2</td>
<td>格力集团</td>
<td>manid00123</td>
<td>冰箱</td>
<td>90公斤</td>
<td>通过</td>
<td><input type="button" value="查看"><input type="button" value="编辑"><input type="button" value="删除"></td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
浏览器文件运行效果如下图: