css - 在生产环境中部署后属性值无效

Question

我有点困惑为什么会在不同的服务器环境中发生这种情况。

我style.scss在我的 Angular 应用程序中声明了一个全局 css 类。此类用于数据输入表单的不同页面。

.form-container ) > * { 
      width: 100%: 
      padding : 1.25rem !important 1.25rem; 
 }

padding如果您可以看到， where, !importantwas placed 在最后一个值之前的值确实有问题。

下面是我在开发工具中检查它时的样子。

预生产

生产

如您所见，在 Pre Production 中，通过这意味着，在我使用上述类的网站中没有应用填充。但是，在另一个剪辑（生产）上，它变成了有效值，但是最后一个值1.25rem被省略了。

我想知道为什么在生产中不会抱怨价值，padding但在预生产中却会抱怨？

我怀疑这可能是使用ng build --prod捆绑角度应用程序时要做的事情，但不确定为什么会发生这种情况。

蒂亚！

标签： cssangularangular-materialangular-reactive-forms

Answer 1

!important必须始终在定义的末尾提及。

下面的定义实际上是无效的，所以浏览器会忽略它。

padding : 1.25rem !important 1.25rem; 

而打包器/压缩器检测到!important并将其称为定义的结尾。它按预期工作。

它通过删除!important标记之外的所有内容以使定义有效，这是在做正确的事情。