1. <input type="tel">：
- 电话号码输入框，用于接受电话号码。
<label for="phone">电话号码：</label>
<input type="tel" id="phone" name="phone" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" required>
2. <input type="search">：
- 搜索框，用于接受搜索关键词。
<label for="search">搜索：</label>
<input type="search" id="search" name="search">
3. <input type="datetime-local">：
- 本地日期和时间输入框。
<label for="datetime">选择日期和时间：</label>
<input type="datetime-local" id="datetime" name="datetime">
4. <input type="month">：
- 月份输入框，用于选择年份和月份。
<label for="month">选择月份：</label>
<input type="month" id="month" name="month">
5. <input type="week">：
- 周数输入框，用于选择年份和周数。
<label for="week">选择周数：</label>
<input type="week" id="week" name="week">
6. <input type="range">：
- 范围输入框，用于选择范围内的值。
<label for="range">选择范围：</label>
<input type="range" id="range" name="range" min="0" max="100" step="1" value="50">
7. <input type="color">：
- 颜色选择器，用于选择颜色。
<label for="color">选择颜色：</label>
<input type="color" id="color" name="color">
8. <datalist>：
- 定义输入框的预定义选项列表。
<label for="browser">选择浏览器：</label>
<input list="browsers" id="browser" name="browser">
<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Safari">
<option value="Edge">
<option value="Opera">
</datalist>
9. <textarea> 的 maxlength 属性：
- 指定 <textarea> 元素的最大字符数。
<label for="message">留言：</label>
<textarea id="message" name="message" maxlength="200"></textarea>
10. <form> 的 novalidate 属性：
- 禁用表单的浏览器默认验证。
<form action="/submit" method="post" novalidate>
<!-- 表单内容 -->
</form>
这些新的表单元素和属性有助于开发者更灵活地设计用户友好的表单，并提供更好的语义化和验证。根据实际需求选择合适的表单元素和属性，可以提升用户体验并简化数据的收集和处理。
转载请注明出处：http://www.zyzy.cn/article/detail/12433/HTML