表单标签(form)
-
表单标签一般用来做用户信息收集，单独用没有一般，一般是结合相关标签来使用(input(最多), select, textarea)
-
表单标签可以对包含在这个标签中的其他标签做信息的提交和重置
-
action: 提交的位置(和接口相关)
-
method: 请求方式(get/post)
input
- 单标签
- 1)type属性:决定输入框的样式
- text(默认) - 普通文本输入框
- password - 密码输入框
- radio - 单选按钮，同一组数据对应的name值设置成一样的，才能做到单选，value只是用于数据提交，不能显示，checked设置为checked让按钮处于默认选中状态
- checkbox - 复选按钮，同一组数据对应的name值要一样,value只用于数据提交，不能显示
- button - 普通按钮，value对应的值会显示在按钮上
- submit - 提交按钮，这个按钮的点击事件会把当前form中，设置name属性的相关的标签的数据以'name=value'
- rest - 重置标签，会重置当前form中的name
- 2)name属性:这个属性主要用来区分数据的。提交的时候是以name-value形式提交
- 3)value属性:
单标签中的value相当于双标签的内容；但是value的值只能是文本
设置value属性其实就是设置输入框中默认显示的内容;修改内容其实是在修改value的值 - 4)placeholder属性:
占位符，输入框中的提示信息 - 5)maxlength属性:
最多输入的字符个数
label
- 双标签
设置for属性的值，为想要关联的按钮的id值，这样点击文字和点击按钮的效果一样
button
- 双标签
中间可以加任何内容
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>表单标签</title>
</head>
<body>
<form class="" method="get">
<input type="text" name="tel" value="" placeholder="请输入账号" maxlength="6">
<input type="password" name="email" value="" placeholder="请输入密码" maxlength="12">
<input type="radio" name="sex" id="" value="男生" checked="checked"><font>男</font>
<input type="radio" name="sex" id="" value="女生"><font>女</font>
<br>
<input type="radio" name="m" id="m1" value="未婚"><label for="m1">未婚</label>
<input type="radio" name="m" id="m2" value="已婚"><label for="m2">已婚</label>
<input type="radio" name="m" id="" value="保密"><font>保密</font>
<br>
<input type="checkbox" name="instr" value="教育"><font>教育</font>
<input type="checkbox" name="instr" value="互联网"><font>互联网</font>
<input type="checkbox" name="instr" value="食品"><font>食品</font>
<br>
<input type="button" name="" value="登陆">
<input type="submit" name="" id="">
<input type="reset" name="" value="重置">
<br>
<input type="color" name="" value="">
<input type="date" name="" value="">
</form>
<button type="button" name="button">登陆</button>
</body>
</html>
网友评论