多个html id标签的css样式

Question

我有几个类似的html ID，例如：

<il id="DashboardPoolAvailable_1"></il>
<il id="DashboardPoolAvailable_2"></il>
<il id="DashboardPoolAvailable_3"></il>
<il id="DashboardPoolAvailable_4"></il>
....

我需要构建一个适用于所有DashboardPoolAvailable_ * ID的唯一CSS代码。类似的东西：

#DashboardPoolAvailable_* { display: inline-block; width: 924px; margin: 0px 13px;}

Answer 1

[id^="DashboardPoolAvailable_"]
{
    //styles
}

更好的方法是将所有li放入带有类的UL中，然后使用类似的内容：

.ul-class li
{
    //styles
}

Answer 2

如果一个样式用于多个元素，那么它应该是一个不是id的类。

考虑对此进行重新分解：

<div class="DashboardPoolAvailable" id="dash1"></div>
<div class="DashboardPoolAvailable" id="dash2"></div>
<div class="DashboardPoolAvailable" id="dash3"></div>


.DashboardPoolAvailable {
  //all shared properties
}

#dash1{ //unique styles}
#dash2{ //unique styles}
#dash3{ //unique styles}

Answer 3

您可以使用此启动属性选择器。 see guide

li[id^='DashboardPoolAvailable_']{
display: inline-block; width: 924px; margin: 0px 13px;
}

Answer 4

使用E[id^=DashboardPoolAvailable_]来匹配您的ID

元素E，其属性id以值DashboardPoolAvailable_开头。