Overrule！important inline CSS

我正在使用Wordpress插件'NextGEN Gallery'和'JJ NextGen JQuery Carousel'，因为我试图制作轮播看起来很像最后一个指定插件的默认外观。问题是，该插件使用一个div的背景图像作为一个按钮，它得到这个CSS：Overrule！important inline CSS

div#about-jcarousel_container .jcarousel-skin-custom .jcarousel-prev-horizontal { 
    top: 188px !important; 
}

正因为如此，这并不正常工作（顶部：0像素部分）：

.jcarousel-skin-custom .jcarousel-prev-horizontal { 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    width: 32px; 
    height: 32px; 
    cursor: pointer; 
    background: rgba(24, 16, 16, 0.43) url(prev-horizontal.png) no-repeat 0 0; 
    background-position-y: 50%; 
    height: 100%; 
}

如果它变得令人讨厌的是188px永远不会被调用任何地方，所以我不能只编辑它使其成为0px，但在浏览器中的客户端。所以我环顾四周，看起来这个插件将188px代码放入内嵌的< style>标签中。因为它具有重要性，所以我不能只使用我的template.css中的重要内容来覆盖它。

另一种方式是否定使用inline的重要标签？我真的希望保持插件可更新。

来源

2013-02-19 Gideon

AFAIK，你可以再次使用'！important'作为你的风格。 – 2013-02-19 10:50:52

你说它有嵌入式框架，但是你发布了CSS规则。你确定第一个吗？ – Pavlo 2013-02-19 10:52:16

@Mr_Green我尝试过，当我这样做时，它被样式标签取代，因为它也很重要。 – Gideon 2013-02-19 10:52:44

覆盖!important的唯一方法是在级联中再次使用!important，因此将它放在jcarousel之后的CSS文件中。

另外，编辑的jCarousel

来源

2013-02-19 10:52:06 Andy

这实际上帮了我很多，我试图在插件之前调用CSS文件，因为它将首先与！重要，但显然它是相反的。我在插件后调用了我的CSS文件，它工作正常！ Mr_Green有同样的答案，但是这首先是如此..是的。 – Gideon 2013-02-19 11:03:55

这就是为什么使用!important气馁。您只能覆盖!important与另一个!important，并不总是可能的。当有!important两条规则时，则应用“最重要”的规则。

现在的问题是，哪一个更重要？

内嵌样式比普通款式更重要（例如<div class="someclass" style="inline style"></div>）
更具体的规则>不太具体（#one。实例标签。是啊>。是啊）
如果两个规则具有相同的优先级，最后一个申请胜利

如果你不能添加更重要的规则，那么你不能覆盖!important。但是，您可以使用脚本在页面加载时添加内联样式。示例（使用jQuery）：

<script> 
$(document).ready(function() { 
    $("#test").css("color","blue"); 
}); 
</script>

例无jQuery的：

<script> 
window.onload = function() { 
    document.getElementById("test").style.color = "yellow"; 
} 
</script>

来源

2013-02-19 10:55:04 TheBronx

AFAIK在< style >标签是所有CSS中最重要的，只有重写它才是重要的，但不好的一面是插件使用了这两个。 – Gideon 2013-02-19 10:57:32

在应用了所有样式后，您可以使用脚本来修改内联样式。这不是很优雅，但如果你至少不能做得更好，那么这是一个解决方案。 – TheBronx 2013-02-19 11:00:40

我该怎么做？对未来似乎很方便。经过测试，内联或包含文件的！importent是相同的，只是最后一个是最重要的。完成了 – Gideon 2013-02-19 11:05:34

看来，你在你的HTML文件的.css文件后，指的的jCarousel的CSS文件。在样式表（.css文件）之前保留jcarousel .css文件的引用。然后，您可以再次使用!important来覆盖默认的jcarousel .css文件样式属性。

来源

2013-02-19 10:56:49

Overrule！important inline CSS

回答

相关问题