如何使用CSS根据文本值更改文本的颜色?

米歇尔·詹姆斯(Michel James):

我有显示足球队统计数据的表格数据。

有列,其字母如下:

  1. “ W”(获胜)
  2. “ L”(丢失)
  3. “ D”(绘制)

那是字母被渲染为单独的列,情况是值是动态的,我需要应用不同的颜色:

  1. 如果使用“ W”,则该文本应为绿色
  2. 如果是“ L”红色
  3. 如果是“ D”色,则为灰色

是否有办法通过CSS?

.table td:nth-child(3) {
  if letter is === W apply green color?
}

<td>
  "W"
</td>     
<td>
  "L"
</td>  
<td>
  "D"
</td> 

在此处输入图片说明

Ess:

如果您可以将这些字母作为属性传递给td元素,则可以在CSS中执行以下操作:

 <td color_code='Your letter'>Your letter</td>

这里的“您的字母”是动态生成的字母。现在,仅在CSS中,只需在调用td元素时指定该属性即可:

td[color_code='L']{ color: red}

其他字母也一样。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章