HTML 中的输入元素是构建表单的基础。这些元素允许用户输入数据,如文本、密码、数字等。以下是一些常见的输入元素及其用途:
常见输入类型
- 文本输入框 (text): 用于输入文本信息。
- 示例:
<input type="text" placeholder="请输入您的名字">
- 示例:
- 密码输入框 (password): 用于输入密码,内容会被隐藏。
- 示例:
<input type="password" placeholder="请输入您的密码">
- 示例:
- 数字输入框 (number): 用于输入数字。
- 示例:
<input type="number" placeholder="请输入您的年龄">
- 示例:
- 电子邮件输入框 (email): 用于输入电子邮件地址。
- 示例:
<input type="email" placeholder="请输入您的电子邮件地址">
- 示例:
- 搜索框 (search): 用于搜索,与
type="text"
类似,但通常带有搜索图标。- 示例:
<input type="search" placeholder="搜索...">
- 示例:
- 电话输入框 (tel): 用于输入电话号码。
- 示例:
<input type="tel" placeholder="请输入您的电话号码">
- 示例:
- 网址输入框 (url): 用于输入网址。
- 示例:
<input type="url" placeholder="请输入网址">
- 示例:
示例
以下是一个简单的表单示例,包含多个输入元素:
<form>
<label for="name">姓名:</label>
<input type="text" id="name" name="name" placeholder="请输入您的名字">
<label for="password">密码:</label>
<input type="password" id="password" name="password" placeholder="请输入您的密码">
<label for="age">年龄:</label>
<input type="number" id="age" name="age" placeholder="请输入您的年龄">
<label for="email">电子邮件:</label>
<input type="email" id="email" name="email" placeholder="请输入您的电子邮件地址">
<input type="submit" value="提交">
</form>
扩展阅读
想要了解更多关于 HTML 输入元素的信息,可以参考以下链接:
希望这些信息能帮助您更好地理解和使用 HTML 输入元素!