HTML5新增表单元素和表单属性，web前端开发项目文档

HTML5 引入了许多新的表单控件和属性，以下是一些常见的示例：

1. 颜色输入（<input type="color">）：

<label for="favcolor">选择你的喜好颜色:</label>
<input type="color" id="favcolor">

2. 日期输入（<input type="date">）：

<label for="birthday">你的生日:</label>
<input type="date" id="birthday">

3. 时间输入（<input type="time">）：

<label for="appointment">指定时间:</label>
<input type="time" id="appointment">

4. 月份输入（<input type="month">）：

<label for="billing-month">计费月份:</label>
<input type="month" id="billing-month">

5. 周输入（<input type="week">）：

<label for="pick-week">选择周:</label>
<input type="week" id="pick-week">

6. 数字输入增强（<input type="number">）：

<label for="quantity">数量:</label>
<input type="number" id="quantity" min="1" max="5" step="1">

7. 搜索输入（<input type="search">）：

<label for="search-input">搜索:</label>
<input type="search" id="search-input">

8. 电邮输入（<input type="email">）：

<label for="email-input">电邮:</label>
<input type="email" id="email-input">

9. 电话输入（<input type="tel">）：

<label for="phone-input">电话号码:</label>
<input type="tel" id="phone-input">

10. 范围输入（<input type="range">）：

<label for="volume-control">音量控制:</label>
<input type="range" id="volume-control" min="1" max="100">

11. 文件多选（<input type="file"> 的 multiple 属性）：

<label for="file-upload">选择多个文件:</label>
<input type="file" id="file-upload" multiple>

12. 隐藏输入（<input type="hidden">）：

<input type="hidden" id="session-id" value="12345">

13. 必填星号标记（required 属性）：

<label for="username">用户名:</label>
<input type="text" id="username" name="username" required>

14. 模式验证（pattern 属性）：

<label for="credit-card">信用卡号:</label>
<input type="text" id="credit-card" name="credit-card" pattern="[0-9]{16}" title="输入16位数字">

15. 输入提示（placeholder 属性）：

<label for="username">用户名:</label>
<input type="text" id="username" name="username" placeholder="请输入用户名">

16. 自动对焦（autofocus 属性）：

<label for="username">用户名:</label>
<input type="text" id="username" name="userna