表单 - 阿霖找BUG

我们一般可以用来做登录页面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--表单form
action：表单提交的位置；可以是网站，也可以是一个请求处理地址
method：get：我们可以在url中看到我们提交的信息；不安全，高效
        post：相对安全，可以传输大文件
-->
<form action="第一个H5.html"method="post">
<!--    文本框：input type="text"-->
    <p>名字：<input type="text"name="username"></p>
<!--    密码框：input type="password"-->
    <p>密码：<input type="password"name="pwd"></p>
    <p>
        <input type="submit">
        <input type="reset">
    </p>
</form>
</body>
</html>

method：get：提交后；

　　　　post：

但只要右键打开检查

提交后；

这里也有账号和密码

type：指定元素类型，一般表格有的类型都有

name：表单元素的名字

value：初始值

size：元素的宽度

maxlength：最大字符数

minlength：最小字符数

checked：type为radio或者checkbox时，指定按钮是否被选中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--表单form
action：表单提交的位置；可以是网站，也可以是一个请求处理地址
method：get：我们可以在url中看到我们提交的信息；不安全，高效
        post：相对安全，可以传输大文件
-->
<!--
type：指定元素类型，一般表格有的类型都有
name：表单元素的名字
value：初始值
size：元素的宽度
maxlength：最大字符数
checked：type为radio或者checkbox时，指定按钮是否被选中
-->
<form action="第一个H5.html"method="post">
<!--    文本框：input type="text"-->
    <p>名字：<input type="text"name="username"value="未注册请注册"size="30"></p>
<!--    密码框：input type="password"-->
    <p>密码：<input type="password"name="pwd"minlength="6"></p>
    <p>
        性别：
        <input type="radio"value="boy"name="sex">男
        <input type="radio"value="gril"name="sex">女
    </p>
    <p>
        <input type="submit">
        <input type="reset">
    </p>
</form>
</body>
</html>

名字初始值为：未注册请注册

密码最短为6位，输入两位就提交，就提示增加到6字符以上

性别这里要加同一个name，不然可以同时选中，提交两个选择上去

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--表单form
action：表单提交的位置；可以是网站，也可以是一个请求处理地址
method：get：我们可以在url中看到我们提交的信息；不安全，高效
        post：相对安全，可以传输大文件
-->
<!--
type：指定元素类型，一般表格有的类型都有
name：表单元素的名字
value：初始值
size：元素的宽度
maxlength：最大字符数
checked：type为radio或者checkbox时，指定按钮是否被选中
-->
<form action="图像标签.html"method="post">
<!--    文本框：input type="text"-->
    <p>名字：<input type="text"name="username"value="未注册请注册"size="30"></p>
<!--    密码框：input type="password"-->
    <p>密码：<input type="password"name="pwd"minlength="6"></p>
    <p>
        性别：
        <input type="radio"value="boy"name="sex">男
        <input type="radio"value="gril"name="sex">女
    </p>
    <p>
        爱好：
        <input type="checkbox"value="sleep"name="hobby">睡觉
        <input type="checkbox"value="gril"name="hobby">女
        <input type="checkbox"value="student"name="hobby">学习
    </p>
<!--
button：普通按钮
image：图片
submit：提交
reset：重置
-->
    <p>按钮：
        <input type="button"name="btn1"value="点击">
        <input type="image"src="../resources/image/1.jpg"width="60px"height="60px">
    </p>
    <p>
        <input type="submit">
        <input type="reset">
    </p>
</form>
</body>
</html>

按钮加了个初始值，点击，就是按钮上的文字，

图片点击，跳转到第一个H5.html，则提交了表单，在等同于点击提交

posted on 2022-07-03 01:11 阿霖找BUG 阅读(32) 评论(0) 收藏举报