html input的认识
input的类型:
1、text 文本框
2、password 密码框
3、radio 单选框
4、checkbox 复选框
5、button 普通按钮
6、submit 提交按钮
7、reset 重置按钮
8、image 图像按钮
9、file 文件按钮
代码演示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<!-- <input /> 我们的input是一个单标签 br hr img base input -->
用户名: <input type="text" value="派克钢笔" /> <!-- 这是一个文本框 --> <br />
密 码: <input type="password" maxlength="6" /> <br /> <!-- 这是一个密码框 ctrl+ / 注释的快捷键 -->
性 别:
<input type="radio" name="sex" /> 女
<input type="radio" name="sex" /> 男
<input type="radio" name="sex" checked="checked"/> 人妖
<input type="radio" name="sex1"/> 未知
<br />
<!-- 单选框 如果是一组,我们通过相同的name值 来实现-->
爱 好:
<input type="checkbox" name="hobby" checked="checked" /> 足球
<input type="checkbox" name="hobby"/> 篮球
<input type="checkbox" name="hobby"/> 乒乓球
<!-- 复选框 可以同时选择多个 --><br />
搜索: <input type="button" value="搜索啥"/> <!-- 普通按钮 --><br />
<input type="submit" value="提交表单" /><!-- 提交按钮 -->
<input type="reset" value="重置表单" /><!-- 重置按钮 --><br />
<input type="image" src="im.jpg" /><!-- 图像按钮 --><br />
上传头像:
<input type="file" /> <!-- 文件按钮 -->
</body>
</html>
图片效果