可以使用CSS设置动态类的样式吗？

Question

我有一个名为.box-159的类，每次刷新屏幕时，数字都会更改。有没有办法在CSS中定义这个字段（比如background-color）？

Answer 1

是的，只能使用仅限CSS 。

选项＃1 - 按前缀值匹配

• 使用CSS Class selector ^="class"选择所有类别以“框 - ”为前缀的元素

[class^="box-"] {
  background: red;
  height: 100px;
  width: 100px;
  margin: 10px 0;
  display:block
}

<div class="box-159"></div>
<span class="box-147"></span>
<article class="box-76878"></article>

选项＃2 - 匹配至少包含一个值

• 使用另一个 CSS类选择器 *="class"（相当于CSS attribute selector）选择其类包含至少一个子字符串“框 - 的所有元素”

[class*="box-"] {
  background: red;
  height: 100px;
  width: 100px;
  margin: 10px 0;
  display:block
}

<div class="box-159"></div>
<span class="box-147"></span>
<article class="box-76878"></article>

Answer 2

你可以添加一个额外的类，然后这两个元素将具有类'CSS attributes：

.box-class {
    background-color: red;
    width: 100px;
    height: 100px;
    margin-bottom: 20px;
}

<div class="box-class box-4"></div>
<div class="box-class box-159"></div>