Question

我想知道是否有办法将相同的样式应用于以相同工作开头的ID。

例如，我有＃youtube_gallery_item_1，＃youtube_gallery_item_2，....并且数字不断增加，因此每次添加新项目时都无法添加新ID。仅供参考，我正在使用Wordpress和YouTube SiimpleGallery插件。

感谢您的帮助！

Answer 1

您可以使用attribute selector：

[id^="youtube_gallery_item"] {
    color: skyblue;
}

http://jsfiddle.net/p9Ya8/

Answer 2

CSS3中的“以”开头“选择器。

div[id^=youtube_gallery_item] {

}

请注意，这在IE8及以下版本中无效。

更好的想法是将所有#youtube_gallery_items分配给一个类，然后为该类分配样式。我确定您正在使用的插件正在执行此操作。查看源代码，如果您发现它们都具有相同的类，请使用：

.name-of-the-class {

}

Answer 3

我建议添加一个类

.youtube_gallery_item {
    background: ;
    width: ;
    ...
}

它与所有浏览器兼容，是最容易到达的方式。

<div id="youtube_gallery_item_1" class="youtube_gallery_item"></div>
<div id="youtube_gallery_item_2" class="youtube_gallery_item"></div>
<div id="youtube_gallery_item_3" class="youtube_gallery_item"></div>

将相同样式应用于具有相同单词的多个ID

3 个答案: