禁用/覆盖Joomla模板CSS

Question

我正在Bootstrap中为Joomla构建模块。 它有自己的样式表，但是激活的模板（在其中进行测试的模板）也使用Bootstrap和类，这些类将一些CSS添加到我的模块（表，按钮等）中。

我希望我的模块在Joomla的所有不同模板中看起来都一样。 有没有一种方法可以为我的模块禁用模板的CSS，以便在每个模板上看起来都一样？ 还是我必须在CSS中声明每一行（使用！important，因为我认为这需要很多工作？）

Answer 1

CSS是在HTML文档中呈现的，因此您不能只是在页面的一部分（即您的模块）上“禁用”它。

一种可能的方法是将模块呈现在<iframe>内部，以便将其作为单独的文档添加到主HTML文档中。 但是我不确定这是否会是好的/推荐的，所以我宁愿重写我的CSS规则，以便它们都从我的模块继承。

例如：如果你的模块是“花式联系模块”，您可以使用一个包装div像<div class="fancy-contact-module">写像所有的CSS规则：

.fancy-contact-module p {
    color: green;
}
.fancy-contact-module a {
    text-decoration: none;
}

等等。

您还可以使用包装div来应用Reset CSS或Normalize CSS（或任何其他类似的工具），因此您无需手动覆盖所有CSS规则。 您可以在此处查看有关Reset和Normalize的更多信息： Normalize.css和Reset CSS有什么区别？