Node crud案例知识点总结
Galloping_Leo 2020-01-28 零散笔记
# Node crud案例知识点总结
# 前端页面
# HTML知识
# 表格
表格结构
<table cellspacing="0" cellpadding="0">
<tr>
<th>学号</th>
<th>姓名</th>
<th>年龄</th>
<th>成绩</th>
<th>操作</th>
</tr>
<tr>
<th>12</th>
<th>李四</th>
<th>23</th>
<th>99</th>
<th>删除</th>
</tr>
</table>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
注意
cellspacing用于设置单元格之间的距离，cellpadding用于设置单元格里面的容与边框的距离th表示表头单元格，tr表示行
# 表单
表单结构
<form method="POST" action="http://127.0.0.1:3000/doadd">
<label>
<div>
添加页面
</div>
</label>
<label>
<label for="">学号</label>
<input type="number" name="number" id="">
</label>
<label>
<label for="">姓名</label>
<input type="text" name="name" id="">
</label>
<label>
<label for="">年龄</label>
<input type="number" name="age" id="">
</label>
<label>
<label for="">成绩</label>
<input type="number" name="grade" id="">
</label>
<label>
<button type="submit">添加</button>
</label>
</form>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
注意
method="POST"代表请求方式为postaction=""设置请求地址form中的input标签一定要有对应的name属性才能向后端发送数据。
# CSS知识
# : active :focus
:avtive 表示此标签被激活的状态 如a标签
.lastpage a:active,
.nextpage a:active {
background-color: white;
color: rgb(3, 162, 145);
}
1
2
3
4
5
2
3
4
5
:focus 表示该标签为获取焦点的状态 如 input 框
input:focus {
border: 1px solid rgb(3, 162, 145);
}
1
2
3
2
3
