禁用/覆蓋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有什么區別？