注册表

注册表

三月 16, 2021

关于html表单的介绍

首先新建一个文件的拓展名为.html
接着在里面写上如下内容

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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>申请表</title>
</head>

<body>
    用户名：<input type="text" name="yuan" value="请输入用户名" maxlength="9"><br>
    密&nbsp&nbsp&nbsp码：<input type="password" name="password"><br>
    性别： 男<input type="radio" name="sex" checked> 女<input type="radio" name="sex"><br>
    生日：<input type="datetime-local" name="birth"> <br>
    兴趣爱好：<input type="checkbox" name="interest">吃饭
    <input type="checkbox" name="interest">睡觉
    <input type="checkbox" name="interest">打豆豆
    <br>
    所在地：<select name="grade">
        <option value="gz">广州</option>
        <option value="sz">深圳</option>
        <option value="bh" selected="selected">北海</option>
        <option value="sh">上海</option>
        <option value="bj">北京</option>
    </select><br>
    <!-- rows表示列的个数  cols表示一行的字数 textarea文本域-->
    自我简介：<br><textarea rows="5" cols="100" name="introduce"></textarea><br>

    <input type="submit" value="注册"><br>
</body>

</html>

input 表示一个输入框，里面加上type可以对输入内容进行限制 ，比如令type=”password”,输入的
类容则会被隐藏，实现密码输入的样式。此外要特别注意别忘记了加 “ “

划重点之单选多选

radio 表示单选 checkbox 表示多选 而对单选或者多选的选项一定要加上一个name值
他们的值是任意的，但单选的选项和多选的选项一定要有一个相同的name

下拉表单的写法

1
2
3
4
5
6
7
8
9

<select name="grade">
        <option value="gz">广州</option>
        <option value="sz">深圳</option>
        <option value="bh" selected="selected">北海</option>
        <option value="sh">上海</option>
        <option value="bj">北京</option>
    </select><br>

与前面不同的是 select标签弹出的可选选项样式
标签内部可以嵌套option标签 这个是里面的选项

最后的提交按钮

1
<input type="submit" value="注册">

这里让type值为submit 里面显示的文字写在value中

或者也可以直接用button标签

1
<button >注册</button>