更改表格单元格的颜色答案

【问题标题】：Changing the colour of a table cell更改表格单元格的颜色
【发布时间】：2015-01-24 20:25:11
【问题描述】：

我正在使用 ASP.net 在 html 表格中显示数据。

    <td>
       <div align="left" >
             <%= %TRIM(DLDPFS + ' ' + Status) %>
       </div>
    </td>

我想要的是如果状态中的值等于特定的东西，它所在的框应该改变颜色。但我不确定这是否可能，因为你不能在 CSS 的条件方面做很多事情。

所以如果 status = 'low' 使单元格变为红色，high 使单元格变为绿色等。

有人对我如何实现这一点有任何想法吗？

【问题讨论】：

标签： html css asp.net html-table

【解决方案1】：

只需将您的状态值放入类属性中，然后添加适当的 CSS。例如

<td class = "<%= %TRIM(DLDPFS + ' ' + Status) %>">
       <div align="left" >
             <%= %TRIM(DLDPFS + ' ' + Status) %>
       </div>
    </td>

Css 例如

.low {
background-color: red;
}

【讨论】：

在 CSS 中我需要 .low 还是字面意思是 .low？
您只需要“.low”。糟糕，您需要在 class 属性周围加上双引号（因此 html 标记看起来像 ''）。刚刚相应地编辑了答案

【解决方案2】：

您可以使用 JS 和 CSS 来实现这一点。

JS：

var val = document.getElementsByTagName("td"),
    len = val.length;

for(var i = 0; i < len; i++){
    var temp = val[i].innerText;

    if(temp > 0){
        val[i].innerHTML = '<span class="high">'+ temp +'</span>'
    } else {
        val[i].innerHTML = '<span class="low">'+ temp +'</span>'
    }
}

CSS：

.high { color:green; }
.low { color:red; }

希望这会有所帮助！

【讨论】：