CSS 在 parent div 上使用动画时延迟后出现框阴影
CSS box shadow appears after delay when using animation on parent div
所以我有多个 div 并且它们使用 css 动画出现，但是当在 div 的 children 中使用框阴影时它会延迟出现。
我添加了 fiddle 以及它在我的项目中的具体示例。
注意在headersbox-shadow当运行代码。
https://fiddle.jshell.net/a7Lu3nxx/
所以我发现，如果我使用animation-fill-mode: forwards or both，那么盒子阴影隐藏在table后面，如果我使用animation-fill-mode: backwards，那么box-shadow出现，但在延迟之后。
我的问题是，如何不使用 JS 或 jQuery。
您的问题是您在两个 container div 中都在淡化。您的盒子阴影将在动画之后出现。如果您希望立即显示它，我建议您包裹上部容器并像下面的 fiddle 一样设置 box-shadow。
Fiddle: https://fiddle.jshell.net/25jzuawc/1/
根据您的评论，您介意框阴影淡入吗？这不会有丑陋的 "all of a sudden" 框阴影外观：
Fiddle: https://fiddle.jshell.net/25jzuawc/2/
没有 first-child 你应该使用 box-shadow inset:
所以我有多个 div 并且它们使用 css 动画出现，但是当在 div 的 children 中使用框阴影时它会延迟出现。
我添加了 fiddle 以及它在我的项目中的具体示例。
注意在headersbox-shadow当运行代码。
https://fiddle.jshell.net/a7Lu3nxx/
所以我发现，如果我使用animation-fill-mode: forwards or both，那么盒子阴影隐藏在table后面，如果我使用animation-fill-mode: backwards，那么box-shadow出现，但在延迟之后。
我的问题是，如何不使用 JS 或 jQuery。
您的问题是您在两个 container div 中都在淡化。您的盒子阴影将在动画之后出现。如果您希望立即显示它，我建议您包裹上部容器并像下面的 fiddle 一样设置 box-shadow。
Fiddle: https://fiddle.jshell.net/25jzuawc/1/
根据您的评论，您介意框阴影淡入吗？这不会有丑陋的 "all of a sudden" 框阴影外观：
Fiddle: https://fiddle.jshell.net/25jzuawc/2/
没有 first-child 你应该使用 box-shadow inset: