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 输入元素!