Question

我正在尝试定位具有与之关联的动态数字的元素。例如，有一次它可能是

#widget-5_yikes_mc_widget-__i__ > div.widget-top > div.widget-title > h4:before

，它的另一个例子可能是

#widget-8_yikes_mc_widget-__i__ > div.widget-top > div.widget-title > h4:before

有没有办法可以定位这些元素而不管它们的数量是多少？也许使用某种类型的通用选择器？我从来没有使用它们，所以我设置它有点困难。

我正在尝试的CSS是：

#widget-^_yikes_mc_widget-__i__ > div.widget-top > div.widget-title > h4:before

我甚至不确定CSS是否可行

Answer 1

*[id^="widget-"] > div.widget-top > div.widget-title > h4:before

如果它也必须以_yikes_mc_widget-__i__结尾，那么：

*[id^="widget-"][id$="_yikes_mc_widget-__i__"] > div.widget-top > div.widget-title > h4:before

或者，如果你只是选择中间有yikes_mc_widget的东西就可以逃脱：

*[id*="_yikes_mc_widget"] > div.widget-top > div.widget-title > h4:before

Answer 2

我很慢但here's a fiddle为例。没有数字选择器，但如上所述，您可以使用ID的其他位来定位这些元素。

div {
    background-color: grey;
}
div[id^=widget] {
    background-color: green;
}
div[id^=widget][id$=__i__] {
    background-color: red;
}