<input>: 输入框标签
最后更新：2026-10-13
<input>输入框标签
<input>（输入）元素是 HTML 中最常用的表单控件，用于创建各种类型的输入框。通过 type 属性可以切换文本框、密码框、复选框、单选钮、日期选择器等数十种形态。它是一个空元素，不需要结束标签。
| 分类 | 表单 |
|---|---|
| 内容模型 | 无（空元素） |
| 允许的父元素 | 接受短语内容的元素，通常放在 <form> 内 |
| 闭合标签 | 自闭合 — 无需闭合标签 |
| 状态 | 标准 |
📝 语法
<input type="text" name="字段名" placeholder="提示文字">⚙️ 属性
该元素支持全局属性及以下专有属性：
| 属性 | 值 | 描述 |
|---|---|---|
type | 关键字 | 输入框的类型，决定控件形态。
|
name | 文本 | 字段名，随表单提交的键名，也是 radio 分组的依据。 |
value | 文本 | 输入框的当前值或默认值。 |
placeholder | 文本 | 输入框为空时显示的提示文字。 |
required | 布尔 | 标记字段为必填，提交时校验。 |
disabled | 布尔 | 禁用字段，不可交互也不随表单提交。 |
readonly | 布尔 | 只读字段，可显示但不可编辑。 |
maxlength | 数字 | 允许输入的最大字符数。 |
checked | 布尔 | 复选框/单选钮的默认选中状态。 |
▶ 示例
编辑下方代码，在 playground 中查看实时效果：
🌐 浏览器支持
| 浏览器 |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <input> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| 所有主流浏览器均支持 | |||||
提示： 始终为 input 设置
name 属性，否则表单提交时该字段的值不会被发送。❓ 常见问题
Qinput 有哪些常用 type？
A文本类：
text、password、email、url、tel、search；选择类：checkbox、radio、file；数值类：number、range；日期类：date、time、datetime-local；还有 hidden、color、submit 等。选对 type 能让手机弹出对应键盘并获得原生校验。Qinput 是空元素吗？
A是空元素（void element），没有结束标签、不能包含内容，所有配置都通过属性完成（value、placeholder、required 等）。这与
<textarea> 不同——后者有结束标签、初始值写在标签之间。Qinput 的 placeholder 能代替 label 吗？
A不能。placeholder 在输入后消失，屏幕阅读器支持也不完整，依赖它做唯一标签会伤害可访问性。
<label> 才是正式的输入说明，placeholder 只放提示示例（如格式样例）。🏷️ 相关标签
💡 相关案例
📚 相关教程
