【HTML5】HTML5 新增 input 表单 ( 邮箱输入表单 | 网址输入表单 | 日期输入表单 | 时间输入表单 | 电话输入表单 | 搜索栏输入表单 | 颜色选择器输入表单 )
在HTML5中,新增了多种输入类型的表单元素,以下是邮箱输入、网址输入和日期输入的示例代码:
<!DOCTYPE html>
<html>
<head>
<title>HTML5 新输入类型示例</title>
</head>
<body>
<form>
<!-- 邮箱输入 -->
<label for="email">邮箱:</label>
<input type="email" id="email" name="email" required>
<!-- 网址输入 -->
<label for="url">网址:</label>
<input type="url" id="url" name="url" required>
<!-- 日期输入 -->
<label for="date">生日:</label>
<input type="date" id="date" name="date">
<input type="submit">
</form>
</body>
</html>
在这个示例中,我们创建了一个简单的表单,包含了邮箱、网址和日期三种类型的输入框。type="email"
用于邮箱输入,type="url"
用于网址输入,type="date"
用于日期输入。每个输入框都有一个label
标签,提供了一个可选的标签,以及一个for
属性,指向输入元素的id
,以提高可访问性。required
属性表示该输入框是必填的。
评论已关闭