1

代码 ：

<html>
<head>
<title>Hello World</title>
</head>
<body>
<table border=1>
<tr>
<td >Old</td>
<td>1</td>
</tr>

<tr>
<td>New</td>
<td>1</td>
</tr>
</table>
</body>

有没有什么技术可以使用 CSS 来突出显示已更改的项目（在本例中为第 2 行的第 1 列）？还是我必须求助于 JavaScript 之类的其他东西？

4

2 回答 2

1

使用如下类：

<html>
<head>
<style type="text/css">
 .highlight{
    background: fuchsia;
}
</style>
<title>Hello World</title>
</head>
<body>
<table border=1>
<tr class="highlight">
<td >Old</td>
<td>1</td>
</tr>

<tr>
<td>New</td>
<td>1</td>
</tr>
</table>
</body>

如果发生变化，您可以将类添加到特定元素：

$(element).addClass('highlight');

或使用纯 JavaScript：

element.class = 'highlight';
于 2013-04-25T06:52:30.847 回答
0

如果您询问如何特别突出第二行的第二列，这将起作用：

table > tr:nth-child(2) > td:nth-child(2) { background-color:#FFEEEE; }

如果您询问如何在任何地方突出显示更改的行，请使用类。

将此添加到您的文档或样式表中。

<style> .highlight { background-color:#FFEEEE; }

将此添加到您的 TD

class="highlight"

于 2013-04-25T06:50:34.953 回答