2012-03-31 96 views
5

我需要与所有输入标签匹配的CSS选择器,其中类型为而不是checkbox选择类型不是复选框的所有输入标签

本场比赛:

<input value="Meow!" />

<input type="password" />

...但是这并没有

<input type="checkbox" />

由于类型为checkbox

这是我的时刻:

input:not(type="checkbox")

不幸的是,它不工作

所以这才是我的问题:

  1. 如何解决我的CSS3选择?
  2. 是否有可能没有CSS3和JavaScript?
  3. 是否有可能没有CSS3,但使用JavaScript?

感谢您的任何建议!

回答

17
  1. 你的属性选择缺少方括号:

    input:not([type="checkbox"]) 
    
  2. 如果你申请的风格,你将需要进行使用替代规则的CSS:

    input { 
        /* Styles for all inputs */ 
    } 
    
    input[type="checkbox"] { 
        /* Override and revert above styles for checkbox inputs */ 
    } 
    

    正如你可以想象的,对于表单元素来说这几乎是不可能的,因为它们的浏览器默认样式在CSS中没有很好的定义。

  3. jQuery提供一个:checkbox selector,您可以使用:

    $('input:not([type="checkbox"])') 
    
+0

感谢:

$('input:not(:checkbox)') 

你也可以为你在CSS中确实使用了同样的选择!我得到的一个想法 - 我可以定义除“复选框”之外的所有可能的输入类型,并将自定义CSS应用于它们。然后,只有没有指定类型的'input'标签才会失败。 – daGrevis 2012-03-31 14:14:46

+0

@daGrevis:是的,这是一个很好的选择。无论如何,你应该避免使用'input'元素。 – BoltClock 2012-03-31 14:15:57

+0

这是为什么?它的HTML5有效并且更易于输入。 – daGrevis 2012-03-31 14:20:00

1

input:not([type="checkbox"])

+0

应该更频繁地刷新页面... :) – 2012-03-31 14:08:49