Chrome等现代浏览器HTML5表单前端验证实例页面

代码：

HTML代码：

<form>
    <p>姓名：<input type="text" required autofocus /></p>
    <p>邮箱：<input type="email" required /></p>
    <p>手机：<input type="tel" pattern="1[0-9]{10}" required /></p>
    <p class="pl40"><input type="submit" /></p>
</form>

效果：