HTML5 表单新增的属性
HTML5 引入了一些新的表单属性，这些属性可以提高表单的可用性和可读性，还可以帮助浏览器更好地理解表单数据的目的和格式。以下是一些常见的 HTML5 表单新属性：
required- 指示输入字段不能为空。pattern- 用于验证输入字段是否符合给定的正则表达式。min和max- 为数值设置最小值和最大值。step- 设置数值输入字段的合法数字间隔。placeholder- 提供输入字段的提示信息。autofocus- 页面加载时自动聚焦到输入字段。multiple- 允许输入字段接受多个值。form- 指定输入字段属于哪个表单，即使输入字段位于表单之外。
示例代码：
<!DOCTYPE html>
<html>
<head>
<title>HTML5 表单新属性示例</title>
</head>
<body>
<form action="/submit">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required>
<label for="email">邮箱:</label>
<input type="email" id="email" name="email" required pattern="[^@]+@[^@]+">
<label for="age">年龄:</label>
<input type="number" id="age" name="age" min="0" max="120" step="1">
<label for="password">密码:</label>
<input type="password" id="password" name="password" placeholder="请输入密码" autocomplete="new-password">
<label for="photo">照片:</label>
<input type="file" id="photo" name="photo" multiple>
<input type="submit">
</form>
</body>
</html>在这个示例中，我们创建了一个带有多个 HTML5 表单属性的表单。每个输入字段都使用了一些新属性来增强用户体验和表单数据的验证。
评论已关闭