效果图 原理 表单元素中,有一个pattern属性,可以自定义正则表达式(如手机号、邮箱、身份证..);valid伪类,可以匹配通过pattern验证的元素;invalid伪类则相反,可以匹配未通过pattern验证的元素;于是就可以随便搞啦,上面的效果图只是做一些简单的效果,更多效果以及限制大家就发挥自己的想象力咯; html 布局很简单,input跟button是兄弟节点的关系,required属性是必填的意思,也就是输入的内容必须要验证通过; <input type=text name=tel placeholder