第二次综合作业
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第二次课后作业</title>
<style>
#p1{
color:rgb(23, 236, 236);
font-weight: bold;
}
.s1{
font-size:smaller;
}
.f1{
height:30px;
color: dimgray;
}
#d1{
float: left;
}
#d2{
background-color: aqua;
font-weight: bold;
color: azure;
width: 100px;
height: 30px;
float: left;
}
.s2{
background-color: aqua;
font-weight: bold;
color: azure;
height: 50px;
}
#d3{
position:fixed;
top:120px;
}
table{
border-collapse: collapse;
position: fixed;
top:180px;
}
table,td{border:1px solid silver}
.t{color: chocolate;}
#r{background-color: rgb(238, 235, 235);}
#d4{
position: fixed;
top:530px;
}
#d5{
margin-left: 150px;
float:left;
}
#d6{
float:left;
margin-left: 8px;
margin-right: 8px;
}
.w{
width: 8px;
}
#s3{color: brown;}
#d7{
float: left;
}
</style>
</head>
<body>
<p id="p1">员工管理</p>
<div id="d1">
<span class="s1">姓名</span><input class="f1" type="text" value="请输入员工姓名">
<span class="s1">性别</span>
<select value="请选择" class="f1">
<option>请选择 </option>
<option>男</option>
<option>女</option>
</select>
<span class="s1">入职时间</span>
<input type="text" value="开始时间 至 结束时间" class="f1">
</div>
<div id="d2"><span> 查询</span></div>
<div id="d3">
<span class="s2">+新增员工</span>
<span class="s2">-批量删除</span>
</div>
<table>
<!--表头-->
<tr id="r">
<td><img src="../自定义img/10.png"></td>
<td>姓名</td> <td>图像</td> <td>性别</td> <td>职位</td> <td>入职时间</td> <td>最后操作时间</td> <td>操作</td>
</tr>
<!--表身-->
<tr>
<td><img src="../自定义img/10.png"></td>
<td>赵敏</td> <td><img src="../自定义img/11.png"></td> <td>女</td> <td>班主任</td> <td>2008-12-8</td> <td>2022-12-22 12：05：20</td> <td class="t">编辑 删除</td>
</tr>
<tr>
<td><img src="../自定义img/10.png"></td>
<td>风清扬</td> <td><img src="../自定义img/11.png"></td> <td>男</td> <td>讲师</td> <td>2008-12-8</td> <td>2022-12-22 12：05：20</td> <td class="t">编辑 删除</td>
</tr>
<tr>
<td><img src="../自定义img/10.png"></td>
<td>张三</td> <td><img src="../自定义img/11.png"></td> <td>女</td> <td>讲师</td> <td>2008-12-8</td> <td>2022-12-22 12：05：20</td> <td class="t">编辑 删除</td>
</tr>
<tr>
<td><img src="../自定义img/10.png"></td>
<td>李四</td> <td><img src="../自定义img/11.png"></td> <td>男</td> <td>讲师</td> <td>2008-12-8</td> <td>2022-12-22 12：05：20</td> <td class="t">编辑 删除</td>
</tr>
<tr>
<td><img src="../自定义img/10.png"></td>
<td>赵五</td> <td><img src="../自定义img/11.png"></td> <td>女</td> <td>讲师</td> <td>2008-12-8</td> <td>2022-12-22 12：05：20</td> <td class="t">编辑 删除</td>
</tr>
<tr>
<td><img src="../自定义img/10.png"></td>
<td>陈六</td> <td><img src="../自定义img/11.png"></td> <td>女</td> <td>讲师</td> <td>2008-12-8</td> <td>2022-12-22 12：05：20</td> <td class="t">编辑 删除</td>
</tr>
</table>
<div id="d4">
<div id="d7">每页展示记录数<input type="text" value="10" class="w"></div>
<div id="d5">共<span id="s3">500</span>条数据</div>
<div id="d6">
<input type="text" value="<" class="w">
<input type="text" value="1" class="w">
<input type="text" value="2" class="w">
<input type="text" value="3" class="w">
<input type="text" value="4" class="w">
<input type="text" value="5" class="w">
<input type="text" value="……" class="w">
<input type="text" value="50" class="w">
<input type="text" value=">" class="w">
</div>
跳至<input type="text" value="1" class="w">页
</div>
</body>
</html>
运行结果：
1224
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
