css选择器匹配没有属性x的元素[重复]

Posted 2023-03-06

【中文标题】css选择器匹配没有属性x的元素[重复]

【英文标题】：css selector to match an element without attribute x [duplicate]

【发布时间】：2010-12-04 17:49:32

【问题描述】：

我正在处理一个 CSS 文件并发现需要对文本输入框进行样式设置，但是，我遇到了问题。我需要一个匹配所有这些元素的简单声明：

<input />
<input type='text' />
<input type='password' />

...但与这些不匹配：

<input type='submit' />
<input type='button' />
<input type='image' />
<input type='file' />
<input type='checkbox' />
<input type='radio' />
<input type='reset' />

这是我想做的：

input[!type], input[type='text'], input[type='password'] 
   /* styles here */

在上面的 CSS 中，注意第一个选择器是 input[!type]。我的意思是我想选择所有未指定类型属性的输入框（因为它默认为文本但input[type='text'] 不匹配）。不幸的是，我在 CSS3 规范中找不到这样的选择器。

有谁知道实现这个的方法吗？

【问题讨论】：

jQuery 选择器：使用 .not()。 $("[data-plot-id]").not('[data-bean-id]').css(border: '5px solid red')

【参考方案1】：

:not 选择器：

input:not([type]), input[type='text'], input[type='password'] 
    /* style here */

Support: 在 Internet Explorer 9 及更高版本中

【讨论】：

我试过 img:not[src=""] visibility: hidden;宽度：0；高度：0； 但不工作请帮助

Anoops，你绝对应该创建一个新问题。

只需要放属性名即可； img : 不是( [ src ] )

【参考方案2】：

对于更跨浏览器的解决方案，您可以为 all 输入您想要的非键入、文本和密码的样式，然后另一种样式覆盖收音机、复选框等的样式。

input  border:solid 1px red; 

input[type=radio], 
input[type=checkbox], 
input[type=submit], 
input[type=reset], 
input[type=file] 
       border:none; 

- 或者-

您的代码中生成非类型输入的任何部分是否可以为它们提供类似.no-type 的类，或者根本不输出？此外，这种类型的选择可以使用 jQuery 来完成。

【参考方案3】：

只是想补充一点，您可以在 oldIE 中使用 selectivizr 使用 :not 选择器：http://selectivizr.com/