动画卡片内下拉菜单的 Z-index 问题答案

【问题标题】：Z-index problem of dropdown menu inside a animated card动画卡片内下拉菜单的 Z-index 问题
【发布时间】：2020-04-29 01:19:02
【问题描述】：

我有一个问题，我试图在这个 stackblitz 中简单地解决（真正的项目是用角度组件和 bootstrap .. 等制作的）： https://stackblitz.com/edit/angular-bootstrap-4-starter-njixcw

在褪色动画卡片中使用下拉菜单时，下拉菜单位于后面，而不是在前面。（点击红色下拉菜单重现）

没有动画的下拉菜单完美运行（点击绿色下拉菜单重现）。

在我看来， opacity 属性有问题，谁能帮我实现相同的结果（保持动画），而不会出现下拉菜单的问题。

非常感谢。

【问题讨论】：

【解决方案1】：

我能够通过将 z-index:1 添加到 .card-body 来解决它

【讨论】：