具有半透明背景的堆叠模态显示具有更亮角落的异常背景

Question

我有一个绝对定位的模态，其半透明背景位于另一个也具有半透明背景的模态之上。通常，由于两个半透明背景重叠，现在背景应该稍微暗一些。

但是，我得到了一个非常奇怪的结果，角落比中间的部分更亮。

我正在使用 Vuejs 框架，最顶层的模态框位于其正下方的模态框模板内。换句话说，最顶层的 modal 是它下面的 modal 的子。

当我显示这个模态时，它后面没有另一个模态，它有一个正常的背景（均匀半透明，没有如图所示的黑暗和明亮部分）。

真的，被这种行为弄糊涂了。可能出了什么问题，我该如何解决？

编辑

我错误地认为下面的模态是绝对定位的。它实际上是固定定位的，将底部模态更改为绝对定位解决了这个问题。

Answer 1

将底部模态的位置更改为绝对可以解决此问题。