我在使用这个特定的CSS选择器时遇到了麻烦,当我添加:not(:empty)
它时,它不希望工作。似乎可以与其他选择器的任何组合正常工作:
input:not(:empty):not(:focus):invalid { border-color: #A22; box-shadow: none }
如果我删除了该:not(:empty)
部件,它就可以正常工作。即使我将选择器更改为input:not(:empty)
它,也不会选择输入了文本的输入字段。这是坏了还是我只是不允许:empty
在:not()
选择器中使用?
我唯一想到的是浏览器仍在说该元素为空,因为它没有子元素,每个元素只有一个“值”。:empty
选择器是否没有针对输入元素和常规元素的单独功能?但这似乎不太可能,因为:empty
在字段上使用并在其中输入内容会导致替代效果消失(因为它不再为空)。
在Firefox 8和Chrome中进行了测试。
作为void元素,HTML定义“空”会将元素<input>
视为空,因为所有void元素的内容模型
始终为空。因此:empty
,无论它们是否有值,它们都将始终与伪类匹配。这也是为什么它们的值由开始标签中的属性而不是开始标签和结束标签中的文本内容表示的原因。
另外,根据Selectors规范:
该
:empty
伪类表示,在所有没有孩子的元素。就文档树而言,只有其数据长度为非零的元素节点和内容节点(例如DOM文本节点,CDATA节点和实体引用)才应被视为影响空度。
因此,input:not(:empty)
永远不会匹配正确的HTML文档中的任何内容。(它在假设的XML文档中仍然有效,该文档定义了<input>
可以接受文本或子元素的元素。)
我认为您不能<input>
仅使用CSS来动态设置空字段的样式(即,只要字段为空,并且一旦输入文本就不应用规则)。如果它们具有空属性()或完全缺少属性(),则可以选择
初始为 空的字段,仅此而已。value``input[value=""]``input:not([value])
问题内容: 我需要在CSS中使用属性选择器来更改不同颜色和图像上的链接,但是它不起作用。 我有这个HTML: 而这个CSS: 为什么背景不是红色的? 问题答案: 在href后面使用$。这将使属性值匹配字符串的结尾。
问题内容: 我正在尝试选择a内的所有元素,但第三个和第四个除外。我设法做到了: 我想合并这些选择器,因为我还有其他条目。像这样的东西,但是没有用: 这 确实 适用于jQuery,但不适用于CSS。我正在使用Chrome(并且我只需要在其中使用它即可)。 我无法找到这种情况的组合选择器。如何将选择器与结合使用? 问题答案: 选择器级别3仅允许伪类中的单个简单选择器使用。作为jQuery选择器,它之所
HTML格式 我没有这个的id或名称。因此我写 但click()没有发生。 已尝试driver . find element(by . CSS selector("。按钮[值=搜索]”)。单击(); 尝试值='Search '(单引号)。 这些选择器正在
问题内容: 我有这样的布局: 使用以下CSS规则: 我使用jQuery将类添加到没有其他类之一的扇区中,或者: 然后,我对该类应用一些不同的规则: 一切都可以在现代浏览器中完美运行。 但是看到jQuery中的选择器是基于CSS3的,我想我可以将其直接移到样式表中,这样我就不必依靠使用jQuery添加额外的类了。此外,我对支持IE的较旧版本并不感兴趣,其他浏览器也对选择器提供了出色的支持。 因此,我
问题内容: 是否有某种“非” CSS选择器? 例如,当我在CSS中编写以下行时,带有类 classname 的标记内的所有输入字段将具有红色背景。 如何选择 类 名为class的标签之外的所有输入字段? 问题答案: 使用当前的浏览器CSS支持,您将无法。 _较新的浏览器现在支持它- (有关CSS中的替代方法,请参见其他答案。) 如果可以在JavaScript / jQuery中执行此操作,则可以执
问题内容: 我有一个带有标头元素的,我在其中加载了项: 在这种情况下,整个情况必须可见。 但是,如果为空,则可以使用CSS 选择器隐藏整个容器,如下所示: 现在,我正在使用选择器隐藏,但是整个都需要隐藏。 我知道JavaScript可以实现,但是在这种情况下,我需要单独使用CSS来实现,但是我不确定这是否可行。 问题答案: 我能提供的最好的方法(请记住,CSS没有父选择器)是将HTML重新组织为以