在css选择器中为属性指定两个或多个值的简单方法 [英] Succinct way of specifying two or more values for an attribute in css selector

问题描述

我有一个CSS选择器如下：

  #foo input [type = number] .form-control，#foo input [type = text] .form-control 
  

$ b b

是否有更简洁的语法：

  #foo input [type = number ，text] .form-control 
  

这不起作用，但是类似吗？

解决方案

不，恐怕没有。虽然在您的示例中没有类似属性选择器中的枚举值建议，选择器4的：matches（） 将至少允许您在单个复合选择器中使用OR两个属性选择器：

< pre class =lang-css prettyprint-override> #foo input：matches（[type = number]，[type = text]）。form-control


也就是说，在可预见的未来，你可能必须坚持使用当前的详细语法，直到浏览器开始实现： matches（）。

I have a CSS selector as follows:

#foo input[type=number].form-control, #foo input[type=text].form-control

Is there a more succinct syntax like:

#foo input[type=number,text].form-control

That doesn't work, but does something similar?

解决方案

No, I'm afraid there isn't. While there are no proposals for enumerated values in attribute selectors like the one in your example, Selectors 4's :matches() will at least allow you to OR two attribute selectors in a single compound selector:

#foo input:matches([type=number], [type=text]).form-control

That said, you will probably have to stick with the current, verbose syntax for the foreseeable future, until browsers start implementing :matches().

这篇关于在css选择器中为属性指定两个或多个值的简单方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！