今天在工作中我遇到了一个非常有趣的难题,甚至无法想象为什么会出现这种情况。好奇心简直要把我逼疯了。
我们有一个客户坚持使用特定字体,而不顾及内联样式。我不想就 !important 的使用方式展开争论。
但是我对这个情况非常好奇。
http://partner-dashboard.qed42.webfactional.com/partner/108/insights/homepage:请查看手风琴中的摘要。注意字体系列。
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 1.1em;
}
.insights-widget-container {
font-family: "Trebuchet MS",Helvetica,sans-serif !important; //I am being overriden
line-height: 1.5;
font-size: 13px;
}
请问这是如何发生的?!important 应该会覆盖 .ui-widget,我甚至提高了特异性。
#insights-widget-container {
font-family: "Trebuchet MS",Helvetica,sans-serif !important; //I am being overriden
}
运气不好!如果有人能够解释一下这是为什么,那将非常有趣?
font-family
是一个自然继承的属性,而padding
不是,因此它们并不真正可比。在开发者工具中,“inherited from…”部分不会列出padding
。 - Alohcifont-family
有更细粒度的赋值,因此!important
标签并不会导致任何级联继承。这就是我在回答中想表达的意思;也许那时候没有完全清楚。 - Josh Burgess