将样式设置为具有随机数的类名称

时间:2018-09-25 07:09:20

标签: css class random styles

如果我有类似的课程

.pin_12345_btn_select

12345是一个随机数(长度可以是5到12个字符)

有没有一种方法可以使用上述随机数为网站中存在的所有这些设置单个类样式。

例如;

.pin_#####_btn_select { Z-index:99; width:220px; }

谢谢

格雷格

1 个答案:

答案 0 :(得分:1)

您可以使用属性选择器提供,开始和结束文本始终相同,只有随机数会更改。

  [class^="pin_"][class$="_btn_select"]

第一个选择器选择以所需文本开始的任何类,第二个选择器选择以所选文本结束的类。如果我们将它们设为单个选择器,那么.....

div {
  padding: 1em;
  margin: 1em auto;
  background: red;
  text-align: center;
}

[class^="pin_"][class$="_btn_select"] {
  background: green;
}

[class$="_btn_select"] {
  background: yellow;
}
<div class="pin_12345_btn_select">Should work</div>
<div class="12345_btn_select">Wont Work Fully</div>
<div class="pin_12345">Definitely won't work</div>
<div class="pin_random_btn_select">Should work</div>