如何覆盖！重要？ [英] How to override !important?

问题描述

我创建了一个自定义样式表，覆盖我的Wordpress模板的原始CSS。但是，在我的日历页面上，原始CSS的每个表格单元格的高度设置为！important 声明：

I have created a custom style sheet that overrides the original CSS for my Wordpress template. However, on my calendar page, the original CSS has the height of each table cell set with the !important declaration:

td {height: 100px !important}

推荐答案

覆盖！重要修饰符

只需添加另一个具有！important 的CSS规则，并为选择器提供更高的特异性（为选择器添加一个附加标记，id或类），或者添加一个CSS

Overriding the !important modifier

Simply add another CSS rule with !important, and either give the selector a higher specificity (adding an additional tag, id or class to the selector), or add a CSS rule with the same selector at a later point than the existing one (in a tie, the last one defined wins).

具有更高特异性的一些例子：

Some examples with a higher specificity:

table td    {height: 50px !important;}
.myTable td {height: 50px !important;}
#myTable td {height: 50px !important;}

相同的选择器之后的现有的：

Or add the same selector after the existing one:

td {height: 50px !important;}

免责声明：

使用！important 。这是WordPress模板的创建者的坏工程。以病毒形式，它强制模板的用户添加自己的！important 修饰符以覆盖它，并且它限制通过JavaScript覆盖它的选项。

Disclaimer:

It's almost never a good idea to use !important. This is bad engineering by the creators of the WordPress template. In viral fashion, it forces users of the template to add their own !important modifiers to override it, and it limits the options for overriding it via JavaScript.

但是，如果你有时需要，可以知道如何覆盖它。

But, it's useful to know how to override it, if you sometimes have to.

这篇关于如何覆盖！重要？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！