使用css

Question

CSS3模块的分类和状态 ●建议
●候选人推荐书 ●最后通话
●工作草案。

我需要在上面看到这个。圆圈必须有不同的颜色。我并没有要求任何人为我这样做，但我希望有人在这里指出我正确的方向。
任何帮助将不胜感激。

Answer 1

您可以将list-style设置为none，并使用:before插入点：

ul,
li {
  list-style: none;
  padding: 0;
  }

.rec:before {
  color: red;
 }
.can:before {
  color: blue;
 }
.lastCall:before {
  color: yellow;
 }

.working:before {
   color: black;
 }

.dot-style:before {
  content: "•";
  padding-right:4px;
  vertical-align:middle;
  font-size:1.8em;
}

<ul>
  <li class="rec dot-style">Recommendation</li>
  <li class="can dot-style">Candidate Recommendation</li>
  <li class="lastCall dot-style">Last Call</li>
  <li class="working dot-style">Working Draft</li>
<ul>

Answer 2

只需在元素周围添加一个范围，然后使用类来更改颜色。

Taxonomy and status of CSS3 modules. <span class="red">●</span> Recommendation <span class="yellow">●</span> Candidate Recommendation <span class="green">●</span> Last Call <span class="blue">●</span> Working Draft

.red{
  color: red;
}
.yellow{
  color: yellow;
}
.green{
  color: green;
 }
.blue{
  color: blue;
}