CSS：超出范围

我一直讨厌的 Web 开发的一个方面是使用表单。由于操作系统和浏览器的差异，表单元素传统上难以设计样式，并且验证可能是一场噩梦。幸运的是，原生 HTML API 添加了改进表单验证情况的方法。

使用input[type=number]元素，您可以添加min和max属性。这些属性很棒，但如果这些数字超出范围，浏览器不会显示明显的错误样式。幸运的是我们有:out-of-range :

  
/* 当 number 不在 min 和 max 之间时匹配 */  
输入[类型=数字]：超出范围 {  
  边框颜色：红色；  
}  

感谢 CSS :out-of-range ，开发人员可以根据其有效值状态设置input元素的样式。尽管有 HTML 验证和样式，您仍然必须进行服务器端验证；老实说，您可能也想在这里进行 JavaScript 验证。

CSS :out-of-range这篇文章首先出现在David Walsh 博客上。

原文： https://davidwalsh.name/css-out-of-range