Z-index 在 CSS 中包含 #答案

【问题标题】：Z-index contains # in CSSZ-index 在 CSS 中包含 #
【发布时间】：2021-06-21 19:24:42
【问题描述】：

我最近从 angular 10 更新到 12。

我使用 SCSS。

更新后，我注意到我的徽标位于内容后面，并且我的所有 z-index 值都在值前添加了 #，我不知道原因，也找不到任何关于此更改源自何处的好信息或是什么原因。

除了包的 src package.json 更新之外，我的配置文件或构建管道没有任何变化

我还使用角度材质作为我的 UI 组件库，并另外导入了引导间距模块

我知道 CSS 无效。（构建后）。它在设计时有效，但在运行时构建后，无论出于何种原因，它都会在前面加上标签。

更新前不是这样

这是设计时间

这是我在这里缺少的一些新的角度特征吗？在文档中找不到任何相关内容。

这和 Ivy 有关系吗？

编辑：

我相信这可能与最近从 @import 到 @use 语句的 sass API 更改有关。 ng update 命令应该（根据文档）为我更新和重构 scss，但事实并非如此。

一旦我完成重构，如果它解决了问题，我将在此处发布它作为答案

【问题讨论】：

它根本无效（正如您在控制台中看到的那样）
当然是无效的。我的观点是，如果有人能通过我最近使用的更改和框架为我指明正确的方向，为什么我会在我的 z-index 值前加上标签。我在 scss 代码中不是无效的。更新后它会像这样编译和输出。我用更多细节进一步更新了问题

【解决方案1】：

更新到 Angular 的最新可用版本。在ng update (12.0.5) 之后，我在 12.0.1 中遇到了同样的问题。

【讨论】：

【解决方案2】：

检查它是否从父类继承 z-index。如果是，则将其放在父类之外。

【讨论】：