HTML表单标签

内容:

1from的概念
2get和post的区别
3input:type=text/password/radio/checkbox/按钮/h5标签
4lable标签
5selected、textarea

概念:用于采集用户输入的数据,用于和服务器交互
from:用于定义一个表达那,可以定义一个范围,范围代表采集用户数据的范围

	属性:
			action:指定提交数据的URL
			method:指定提交方式,一共7种,2种比较常用
					get:
						1、请求参数会在地址栏中显示,会封装到请求行种
						2、请求参数是有大小限制的
						3、不太安全
					post	:
						1、请求参数不会在地址栏种显示,会封装在请求体种
						2、请求参数的大小没有限制
						3、较为安全

注意:表单项中的数据想要被提交:必须指定其name属性,我自己的猜测,指定了name属性提交的时候会放到request域中,可以被后台获取,这个地方还需要查资料核实

表单项标签

input

<input>:可以通过改变type属性值,改变元素展示的样式
			type属性:
				text:文本输入框,默认值
					placehold:指定输入框的提示信息,当输入框的内容发生变化,会自动清空提示信息
				password:输入的数据展示小点点
				radio:单选框
					注意:
					1、要想让多个单选框实现单选的效果,则多个单选框的name属性值必须一样
					2、一般会给一个单选框提供**value**属性,指定其被选中后提交的值
					3、checked属性,可以指定默认值
				checkbox:
					1、要想让多个单选框实现单选的效果,则多个单选框的name属性值必须一样
					2、一般会给一个单选框提供**value**属性,指定其被选中后提交的值
					3、checked属性,可以指定默认值
				file:文件选择框
				hidden:隐藏域,用于提交一些信息
				**按钮:
					submit:提交按钮,可以提交表单
					button:普通按钮
					image:用src指定一张图片,图片按钮
<label></label>:指定输入项的文字描述信息
		**label的for属性一般会和input的id属性值对应**,点击label对应区域光标会到input输入框去

代码示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>form</title>
</head>
<body>
<form action="#">
    <label for="username">用户名:</label><input type="text" name="username" id="username" placeholder="请输入用户名"><br>
    密码:<input type="password" name="password" placeholder="请输入密码"><br>
    性别:<input type="radio" name="gender" value="male"><input type="radio" name="gender" value="female"><br>
    爱好:<input type="checkbox" name="hobby" value="shopping">逛街
    <input type="checkbox" name="hobby" value="JAVA">JAVA
    <input type="checkbox" name="hobby" value="game">游戏
    <br>
    图片:<input type="file" name="file">
    <br>
    隐藏域:<input type="hidden">
    <input type="submit" value="登录">
    h5定义的标签
    取色器:<input type="color" name="color">
    生日:<input type="date" name="birthday">
    邮箱:<input type="email" name="email">
    年龄:<input type="number" name="age">

</form>
</body>
</html>

在这里插入图片描述

select:下拉表标签
          option指定备选项,selected指定默认值

    <select name="province">
        <option>--请选择--</option>
        <option value="1">北京</option>
        <option value="2">上海</option>
    </select>

textarea:文本域
cols:指定列数,每一行有多少字符
rows:有多少行

<textarea cols="20" rows="5" name="des"></textarea>
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值