通配符*在CSS的类
我有这些div我正在与.tocolor风格，但我也需要唯一标识符1,2,3,4等，所以我把它作为另一个类tocolor-1 。
<div class="tocolor tocolor-1"> tocolor 1 </div> <div class="tocolor tocolor-2"> tocolor 2 </div> <div class="tocolor tocolor-3"> tocolor 3 </div> <div class="tocolor tocolor-4"> tocolor 4 </div> .tocolor{ background: red; }
有没有办法只有1classtocolor-* 。 我尝试使用通配符*在这个CSS，但它没有工作。
.tocolor-*{ background: red; }
你需要的是所谓的属性select器。 一个例子，使用你的html结构，如下所示：
div[class^="tocolor-"], div[class*=" tocolor-"] { color:red }
在div的地方，你可以添加任何元素或完全删除它，在class的位置，你可以添加指定元素的任何属性。
[class^="tocolor-"] – 以“tocolor-”开头。
[class*=" tocolor-"] – 包含在空格字符后面直接出现的子string“tocolor-”。
演示： http : //jsfiddle.net/K3693/1/
有关CSS属性select器的更多信息，可以在这里和这里find。
是的，你可以这样做。
*[id^='term-']{ [css here] }
这将select所有以'term-'开头的id。
至于没有这样做的原因，我看到哪里select这种方式会更可取; 至于风格，我不会自己做，但这是可能的。
另一种解决scheme：
div[class|='tocolor']将匹配以“tocolor-”开头的“class”属性值，包括“tocolor-1”，“tocolor-2”等。
注意这不符合`
参考： https ： //www.w3.org/TR/css3-selectors/#attribute-representation
[att|=val]表示具有att属性的元素，其值或者正好是“val”或者以“val”开头，紧跟着“ – ”（U + 002D）
如果你不需要独特的标识符进一步的div风格，并使用HTML5，你可以尝试去与自定义的数据属性。 在这里阅读或尝试谷歌searchHTML5 Custom Data Attributes
