直接用 CSS @keyframes + animation 实现闪烁，避免 JS；Safari 表格中 opacity 动画易闪烁，应包裹内容于 div 再动画，并禁用 filter/transform 叠加，推荐周期 0.75s–1.2s、step-start 切换。
直接用 CSS @keyframes + animation 就能实现，不需要 JS，但要注意 Safari 在 <table> 里动态改 opacity 会闪烁或卡顿——这是 WebKit 渲染层的老问题。
用 @keyframes 定义透明度切换动画
核心是让 opacity 在 0 和 1 之间跳变，避免渐变过渡，否则看起来像“呼吸”而不是“闪烁”。step-start 关键字能强制帧级切换，效果更干脆：
@keyframes blink {
0%, 50% { opacity: 1; }
51%, 100% { opacity: 0; }
}
.blink-cell {
animation: blink 1s step-start infinite;
}
- 别用
linear或默认缓动，它会让闪烁变模糊 - 周期设太短（如
0.3s）容易引发视觉疲劳，建议0.75s–1.2s - 如果单元格含文字，确保父容器没设
overflow: hidden，否则 Safari 可能裁掉闪动帧
给目标 <td> 应用样式并启用 HTML 渲染
单纯加 class 不一定生效——很多报表工具（如 FineReport）或富文本场景下，单元格内容是字符串，必须显式开启 HTML 解析：
- 在
<td>上加class="blink-cell"，同时确认该单元格支持内联 HTML（比如 FineReport 要勾选「用 HTML 显示内容」） - 若用纯 HTML 表格，直接写：
<td class="blink-cell">警告值</td> - 不推荐用
<blink>标签：已废弃，Chrome/Firefox/Safari 全都不支持
Safari 下表格单元格闪烁异常怎么办
这不是代码写错了，是 WebKit 对 <table> 内 filter 或 opacity 动画的图层管理缺陷：每次重绘都重建渲染层，导致延迟或闪烁。临时绕过方法：
立即学习“前端免费学习笔记（深入）”；
- 把要闪烁的单元格内容包一层
<div>，再对这个<div>动画，而不是直接动<td> - 避免在
<td>上同时用filter、transform和animation，三者叠加会加剧 Safari 崩溃概率 - 真要兼容 Safari，可降级为「单次闪三次」：用 JS 控制
classList.add('blink-once')，CSS 里设animation-iteration-count: 3，播完自动停
真正麻烦的不是怎么写动画，而是表格结构本身会干扰渲染管线——尤其是带 border-collapse: collapse 或合并单元格（rowspan/colspan）时，Safari 对子元素动画的定位经常偏移。动手前先在 Safari 里开开发者工具，勾选「Rendering」→「Paint flashing」，看实际重绘区域是不是只覆盖了你要闪的那个格子。
