input标签不同的type属性值：password、text、checkbox、button、radio

input标签用于搜集用户信息
根据不同的type属性值，输入字段拥有很多形式。
输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
type属性：
button:定义可点击的按钮
checkbox：定义复选框
file：定义输入字段和“浏览”按钮
hidden：定义隐藏的输入字段。
image:定义图像形式的提交按钮。
password:定义密码字段。该字段中的字符被掩码
radio:定义单选按钮
reset:定义重置按钮。重置按钮会清除表单中的所有数据。
submit:定义提交按钮。提交按钮会把表单数据发送到服务器。
text:定义单行的输入字段，用户可在其中输入文本。默认宽度为20字符。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>input标签学习</title>
		<!--input标签用于搜集用户信息
			根据不同的type属性值，输入字段拥有很多形式。
			输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
		type属性：
		button:定义可点击的按钮
		checkbox：定义复选框
		file：定义输入字段和“浏览”按钮
		hidden：定义隐藏的输入字段。
		image:定义图像形式的提交按钮。
		password:定义密码字段。该字段中的字符被掩码
		radio:定义单选按钮
		reset:定义重置按钮。重置按钮会清除表单中的所有数据。
		submit:定义提交按钮。提交按钮会把表单数据发送到服务器。
		text:定义单行的输入字段，用户可在其中输入文本。默认宽度为20字符。
		
		-->
		<style>
			 .but{
			 	width: 50px;
			 	height: 30px;
			 }
		</style>
	</head>
	<body>
		<input type="text" />
		<input type="password" />
		<input type="button" class="but" value="确定"/>
		<input type="radio" />
		<!--对于按钮若要提供单选让他们后面名字相同即可-->
		<div>
			男<input type="radio" name="123"/>
		</div>
		<div>
			女<input type="radio" name="123"/>
		</div>
		<!--多选框checkbox-->
		<input type="checkbox" />
		<input type="checkbox" />
		<input type="checkbox" />
	</body>
</html>

　　原文：https://blog.csdn.net/qq_33322074/article/details/79696221

posted @ 2024-01-23 11:32  瘋耔  阅读(168)  评论(0)  编辑  收藏  举报
跳至侧栏