:not(:empty) CSS 选择器不起作用
:not(:empty) 选择器无法定位包含文本内容的输入字段。组合多个选择器时会出现此问题,特别是 :not(:empty):not(:focus):invalid。删除 :not(:empty) 可以解决问题,但在 :not() 中使用它似乎不一致。
澄清一下,:empty 选择器指示没有子节点的元素。在输入元素的上下文中,这包括那些没有文本内容的元素。然而,HTML 定义将输入元素分类为 void,这意味着它们本质上是空的。
如选择器规范中所述,“:empty 伪类表示根本没有子元素的元素”。这包括输入元素,无论其值如何,因此 input:not(:empty) 实际上永远不会选择有效 HTML 中的任何内容。
虽然 CSS 本身无法动态设置空输入字段的样式,但您可以使用 [value 来定位最初为空的字段=""] 或 :not([value]) 来设计适当的初始状态。
以上是为什么 :not(:empty) 不适用于带有文本的输入字段?的详细内容。更多信息请关注PHP中文网其他相关文章!