我已经在一个网站上工作了几个月,很多时候当我试图编辑一些东西时,我必须使用!important,例如:
div.myDiv {
width: 400px !important;
}
为了让它按预期显示。这是不好的做法吗?或者可以使用!important命令吗?这是否会导致后续出现不希望出现的情况?
我已经在一个网站上工作了几个月,很多时候当我试图编辑一些东西时,我必须使用!important,例如:
div.myDiv {
width: 400px !important;
}
为了让它按预期显示。这是不好的做法吗?或者可以使用!important命令吗?这是否会导致后续出现不希望出现的情况?
当前回答
对我来说,使用!important是一个糟糕的CSS实践。它破坏了应用css规则的自然流程,其中属性是从上到下应用的。使用!important,属性现在将优先考虑最新的重要值。
这就像在脚本中使用goto关键字一样。虽然这是完全合法的,但还是最好避免。
其他回答
important是一个因子,它会使你的代码因为某些被重写的东西而失效
!它并不意味着逻辑上的不,这样在代码中就会让人感到不安。重要的是经常是一个巨大的事故在计算。
例如,如果你想让它显示:block; 但是你已经定义了display: none;:
p { 显示:没有; important /*现在重写*/; } < / p > < p >一些段落
important是一个最好避免的关键字,什么时候使用它,它可能是一个有影响力的时间,请点击这个链接,看看什么时候使用!important, !important风格规则- css技巧
不奇怪什么
对我来说,使用!important是一个糟糕的CSS实践。它破坏了应用css规则的自然流程,其中属性是从上到下应用的。使用!important,属性现在将优先考虑最新的重要值。
这就像在脚本中使用goto关键字一样。虽然这是完全合法的,但还是最好避免。
!重要的力量,这句话总是适用,做这些事情:
即使选择器的特异性较低,级别也较低,它现在也优于特异性较高的选择器 如果该语句再次出现,通常会覆盖该语句,那么它将不再覆盖该重要语句
大多数情况下,可以避免使用!important,因为选择器的特殊性决定了哪个选择器生效,这就是级联样式的思想。然而,在某些情况下(我不太记得具体是什么情况了),特异性就不那么符合逻辑了,我不得不在语句中强加!important。
不使用/避免的原因!
阻止用户使用自定义样式表(现在不能覆盖标记为重要的规则),这破坏了某些人的可访问性 使代码更难阅读,因为大脑通常很容易接受特殊性,但记住什么是重要的会使代码更难阅读
是的,我想说你使用!important的例子是不好的做法,而且很可能会导致后续的不良影响。但这并不意味着它永远都不能使用。
有什么问题吗?
当浏览器决定CSS如何影响页面时,专用性是起作用的主要因素之一。选择器越具体,它的重要性就越高。这通常与所选元素出现的频率一致。例如:
button {
color: black;
}
button.highlight {
color: blue;
font-size: 1.5em;
}
button#buyNow {
color: green;
font-size: 2em;
}
在本页上,所有按钮都是黑色的。除了类为“highlight”的按钮是蓝色的。除了一个标识为“buyNow”的独特按钮,它是绿色的。整个规则的重要性(在本例中包括颜色和字体大小)由选择器的特异性来管理。
但是,important是在属性级别添加的,而不是在选择器级别。例如,如果我们使用这个规则:
button.highlight {
color: blue !important;
font-size: 1.5em;
}
那么颜色属性的重要性将高于字体大小。事实上,颜色比按钮#buyNow选择器中的颜色更重要,而不是字体大小(仍然由常规ID与类特异性控制)。
元素<button class="highlight" id="buyNow">的字体大小为2em,但颜色为蓝色。
这意味着两件事:
选择器不能准确地传达其中所有规则的重要性 覆盖蓝色的唯一方法是使用另一个!important声明,例如在按钮#buyNow选择器中。
这不仅使样式表更难维护和调试,而且开始了滚雪球效应。一个!重要的会导致另一个去覆盖它,再一个去覆盖那个,等等。它几乎不会只停留在一个人身上。即使一个!重要的可以是一个有用的短期解决方案,从长远来看,它会回来咬你的屁股。
什么时候可以使用:
重写用户样式表中的样式。
这就是!important最初被发明出来的目的:给用户一种覆盖网站样式的方法。它被屏幕阅读器、广告拦截器等辅助工具大量使用。
覆盖第三方代码和行内样式。
一般来说,我会说这是一个代码气味的情况,但有时你只是没有选择。作为一名开发人员,你的目标应该是尽可能多地控制你的代码,但在有些情况下,你的双手受到束缚,你只能使用现有的任何东西。少用!important。
实用程序类
许多库和框架都带有实用程序类,如.hidden、.error或.clearfix。它们只有一个目的,通常适用的规则很少,但却非常重要。(例如,对于.hidden类,display: none)。这些应该覆盖当前元素上的任何其他样式,如果你问我的话,这肯定是重要的。
结论
使用!important声明通常被认为是不好的做法,因为它有副作用,会破坏CSS的核心机制之一:特异性。在许多情况下,使用它可能表明CSS体系结构很差。
在某些情况下,它是可以忍受的,甚至是首选的,但在使用它之前,一定要仔细检查这些情况是否真的适用于您的情况。
如果你想透支wp-plugins的默认属性,我认为有时候使用!important是“必须做的工作”。
我今天才用过,这是我完成任务的唯一方法。 也许不是做某事的好方法,但有时是唯一的方法。