demo.html:
< !DOCTYPE html > < html lang="en" > < head > < meta charset="UTF-8" > < title >Document< /title > < style > form { width: 100%; max-width: 640px; min-width: 320px; margin: 0 auto; font-family: "Microsoft Yahei"; font-size: 20px; } input { display: block; width: 100%; height: 30px; margin: 10px 0; } < /style > < /head > < body > < form action="" > < fieldset > < legend >表单属性< /legend > < label for="" > email: < input type="email" name="email" > < /label > < label for="" > tel: < input type="tel" name="tel" > < !-- 本身不验证,自己添加验证 -- > < /label > < label for="" > url: < input type="url" name="url" > < /label > < label for="" > number: < input type="number" name="number" step="5" > < !--输入的是步长的整倍数-- > < /label > < label for="" > search: < input type="search" name="search" > < !--移动端出现的小键盘右下角是搜索按钮-- > < /label > < label for="" > range: < input type="range" name="range" value="100" min="0" max="300" > < !--默认最小0 最大100-- > < /label > < label for="" > < label for="" > color: < input type="color" name="color" > < /label > time: < input type="time" name="time" > < /label > < label for="" > date: < input type="date" name="date" > < /label > < label for="" > month: < input type="month" name="month" > < /label > < label for="" > week: < input type="week" name="week" > < /label > < label for="" > datetime: < input type="datetime" name="datetime" > < /label > < input type="submit" value="提交" > < /fieldset > < /form > < /body > < /html > 总结
以上所述是小编给大家介绍的HTML5 新表单类型示例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对本站网站的支持!
注:相关教程知识阅读请移步到HTML教程频道。