css - 在 CSS 中淡出一个新行

Question

所以我有这张表，我知道如何在其中突出显示第二个 child 。但是我希望它淡出，这样很明显添加了一个新行。目前，第二行总是突出显示，但是想要一些关于如何淡出 CSS 的指导(我的代码中没有使用 jquery)

我注意到 jquery 中有淡出选项，但有人可以告诉我如何在纯 css 中淡出。下面是突出显示第二行的行。我想淡出表示表格中添加了新行。

tr:nth-child(2){background-color: red;}

Answer 1

如果我明白你问的是什么，你可以用animation

tr:nth-child(2){
  background-color: red;
  animation: fadeout 2s forwards;
}

@keyframes fadeout {
    to {
        background-color:#ffffff;
    }
}