-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathregistration
More file actions
124 lines (104 loc) · 3.07 KB
/
registration
File metadata and controls
124 lines (104 loc) · 3.07 KB
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
This is where things get nasty (at least for me…)
主要内容：
<form></form>
<input> | <input type="xxxx">
<label></label>
label有两种形式：
<label>
Email:
<input name="Email:" type="text" placeholder="your name">
</label>
或者for和id对应：
<label for="username">Username:</label>
<input id="username" type="text" placeholder="xxx">
radio button：n选1，给个相同name
<label for="male" >Male</label>
<input name="gender" id="male" type="radio">
<label for="female">Female</label>
<input name="gender" id="female" type="radio">
<label for="other">Other</label>
<input name="gender" id="other" type="radio">
Send the data in the request: need a name
作业html，跟Colt不一样的部分单独标出来了，做出来效果一样的我姑且认为我的也对...
<!DOCTYPE html>
<html>
<head>
<title>Register</title>
</head>
<body>
<h1>Register</h1>
<form>
<p>
<label>
First Name:
<input name="first" type="text" placeholder="John" required>
</label>
<label>
Last Name:
<input name="last" type="text" placeholder="Smith" required>
</label>
</p>
colt用了for／id：
<label for="first">First Name: </label>
<input id="first" name="first" type="text" placeholder="John" required>
<label for="last">Last Name: </label>
<input id="last" name="last" type="text" placeholder="Smith" required>
并且他分段用了<div></div>
<p>
<label for="male" >Male</label>
<input name="gender" id="male" type="radio" value="MALE">
<label for="female">Female</label>
<input name="gender" id="female" type="radio" value="FEMALE">
<label for="other">Other</label>
<input name="gender" id="other" type="radio" value="OTHER">
</p>
<div>
<label>
Email:
<input name="email" type="email" placeholder="your email" required>
</label>
<label>
Password:
<input name="password" type="password" pattern=".{5,10}" required title="Password must be between 5 and 10 characters" required>
</label>
</div>
具体跟pattern attribute有关的信息看上面，大概是 pattern=".{a,b}" required title=
"(what you wanna be seen)Password must be between a and b characters" 下次应该会有更具体的应用
还提到了maxlength和minlength有些浏览器不支持
<p>
<label>
Birthday:
<select name="month">
<option value="">Month</option>
<option>Jan</option>
<option>Feb</option>
<option>Mar</option>
<option>Apr</option>
</select>
<select name="day">
<option>Day</option>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<select name="year">
<option>Year</option>
<option>1900</option>
<option>1901</option>
<option>1902</option>
</select>
</label>
</p>
这个完全一步步内嵌的格式我是真懒得去调了，p和div就让它们先这样吧啊
<p>I agree to the terms and conditions <input type="checkbox"></p>
来来来看看大神是如何统一格式的：
<div>
<lable for="agreed">I agree to the terms and conditions</label>
<input id="agreed" name="agreed" type="checkbox">
</div>
<button>Submit</button>
统一格式看这里：
<input text="submit">
</form>
</body>
</html>