！important标签不会覆盖CSS样式

问题描述

我正在使用Materialize.CSS框架，并且覆盖了我想通过样式表中的！important标记更改的大多数样式，该样式可以按预期工作，但是我的!important标记未覆盖某些元素样式

我检查了开发工具，发现默认样式框架正应用于某些元素（如卡，卡片标题等）。已经在其上应用了！important标签，这可能覆盖了我的important或具有更高的优先级。

所以请告诉我们如何解决这个问题。

[屏幕截图] [1]：https://i.stack.imgur.com/wVHgr.png

解决方法

.grey-text.text-darken-2和.grey-text都具有!important，但.grey-text.text-darken-2的特异性大于.grey-text。 more about that。

,

有两种方法可以解决此问题：

1. 在文件的后面，将output { kafka { id => "sink" codec => [...] bootstrap_servers => [...] topic_id => "%{[service_name]}" [...] } } 添加到同一CSS选择器中。
2. 添加另一个具有更高特异性的CSS选择器，并对其应用!important。

建议：始终建议添加一个小的代码段来解释您的问题。 ：D

,

如果您的!important被另一个具有更高优先级的用户覆盖，则您始终可以优先使用像body这样的更高父级来剪切

例如。如果：

.container .label {color:red !important;}

被替换为您写的同一行，请添加以下提示：

body .container .label {color:red !important;}

此外，如果您使用id（＃）来调用CSS类中的元素，则它将覆盖class所调用的相同属性，即使该元素按工作表顺序放在前面