使用 CSS 进行密码验证
Password validation with CSS
对于一些学生，我在 html 和 javascript 中做了一些简单的密码验证 hack
现在我想知道我是否可以只使用 html 和 css（所以没有 javascript）进行密码验证？
我知道 css 不用于表单验证，仅用于修改一些道具，如颜色，作为对验证过程的反应。但是 html 输入模式和类型属性是。
我不知道把最后两句话放在哪里 - 在这里，作为评论或答案，所以就在这里。干杯
您可以使用 HTML5 pattern 属性 (see here for more information)，它允许您将允许的模式定义为正则表达式。请记住，并非所有浏览器都支持此功能。
电子邮件的 input 元素可能如下所示：
<input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" />
然后您可以使用 CSS 给用户反馈，如果该字段的值无效：
input:invalid {
border-color: red;
}
input:valid {
border-color: green;
}
对于一些学生，我在 html 和 javascript 中做了一些简单的密码验证 hack 现在我想知道我是否可以只使用 html 和 css（所以没有 javascript）进行密码验证？
我知道 css 不用于表单验证，仅用于修改一些道具，如颜色，作为对验证过程的反应。但是 html 输入模式和类型属性是。 我不知道把最后两句话放在哪里 - 在这里，作为评论或答案，所以就在这里。干杯
您可以使用 HTML5 pattern 属性 (see here for more information)，它允许您将允许的模式定义为正则表达式。请记住，并非所有浏览器都支持此功能。
电子邮件的 input 元素可能如下所示：
<input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" />
然后您可以使用 CSS 给用户反馈，如果该字段的值无效：
input:invalid {
border-color: red;
}
input:valid {
border-color: green;
}