突出显示元素，然后转换回原始颜色
突出显示元素，然后转换回原始颜色
提问于 2019-04-25 01:14:50
我有一些具有不同background-color的元素。当点击一个链接时，我想用不同的颜色(黄色)突出显示该元素，然后淡出为该元素的原始颜色。我知道元素的color有currentColor，但是background-color没有类似的东西。
如何从高亮颜色平滑地转换回元素的原始background-color**?** 现在它从高亮颜色淡入透明，然后在动画结束时突然跳回原始颜色。
:target td {
animation: highlight 1s;
}
@keyframes highlight {
from {
background-color: yellow;
}
to {
/* How do I set this back to the element's original background-color? */
background-color: transparent;
}
}<ul>
<li>
<a href="#link1">Link #1</a>
</li>
<li>
<a href="#link2">Link #2</a>
</li>
<li>
<a href="#link3">Link #3</a>
</li>
</ul>
<table>
<tr id="link1">
<td>This is Link #1</td><td>// Fine.</td>
</tr>
<tr id="link2">
<td bgcolor="orange">This is Link #2</td><td>// Ugly.</td>
</tr>
<tr id="link3">
<td bgcolor="red">This is Link #3</td><td>// Ugly.</td>
</tr>
</table>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55835356
复制相关文章
相似问题
腾讯云开发者
