Html CSS：覆盖！和别人在一起很重要！重要的是不工作？

我确信我遗漏了一些简单的东西，但在搜索了一段时间后，没有找到任何答案，我的问题是：

我正在为Joomla！开发一个组件！。就功能而言，组件本身工作正常。然而，我注意到的是，某些样式不起作用

• 我在一个div中包含了一个表，每个表都有自己的类用于样式设置
• 在我测试了几个不同的模板以查看它们对我的样式的影响之前，样式设计一直都很好
• 由于模板来自各种模板的样式，我的表格比窗口宽（模板的CSS中有

  宽度：540px！重要；

  ）

---

• 我试图覆盖它是为了添加

  width:100%！重要的到组件输出中的
  标记-在文档正文内。这将确保最后加载我的CSS，这将覆盖模板中的CSS
  加载CSS的顺序如下：在文档的
  中：我的组件的CSS，然后是模板CSS。这会导致模板覆盖我的CSS。因此，我决定在我的组件的开始div标记的正上方的body标记中添加样式标记
  

所有这一切的结果是，我的CSS确实是最后加载的，从我的组件的开始div标记正上方的样式标记加载。但是，模板中的CSS仍然应用于我的

据我所知，这不是很好的实践使用！从一开始就很重要，然后用另一个来覆盖它！重要也不伟大。如果我错了，请纠正我，并提供一个可能的答案，说明如何覆盖模板的CSS，并确保应用我的组件的CSS，而不直接修改模板；该组件应独立于模板，并且无论模板的样式如何，都应始终工作

提前谢谢

/*******编辑******/

下面是有问题的代码-以摘要形式（如果从模板中包含大量代码，那就太过分了，但如果需要，欢迎您提出更多要求）：

以下是chrome inspector的两个屏幕剪报：

/**********第二次编辑***********/

谢谢大家的建议。最后，我在自己的CSS中使用了

minwidth

和

max width

来应用高度。这不是最好的解决方案，但似乎确实有效。另外，我之前没有注意到表中的

tbody

也有模板应用的宽度，这似乎也会干扰我的样式设置。

---

在我的表中添加一个类仍然没有多大帮助；虽然添加一个ID确实有效（通过向该ID添加CSS）-尽管我仍然必须应用

！重要信息

请参阅规则，以确保模板CSS被覆盖。

有3种方法可以覆盖

！重要信息

CSS声明：

• 添加一个更具体的！重要属性：

  正文表{width:100%！important；}

  （例如）
• 声明相同的规则，但在要覆盖的规则之后
• 在HTML元素中声明它：

---

请注意，所有这些都有点脏。

我不记得什么是有效的，但以下是我将尝试的：

而不是使用

table {width:...!important}

使用（确保您的表具有id）

或者使用内联css

style="width:100%!important"

---

或者使用div而不是table

“这将确保我的CSS最后加载，这将覆盖模板中的CSS”-CSS不是这样工作的<代码>！重要信息切勿被动使用，只能主动使用。

！重要信息

最后加载的标记，即代码中最后包含的标记，将是样式化的标记。@user3008011-正如我在上一篇评论中的链接中指出的，这不一定是正确的。模板使用的是

表{width:540px！important；}

？来真的如何在组件中应用100%宽度样式？你能出示你的密码吗？老实说，你永远不会得到任何完美的模板，因为很多模板开发人员认为使用

是可以的！重要信息

供自己使用，这意味着it扩展开发人员无法轻松地设计他们的扩展，请尝试向表中添加一个类，并在CSSThanks@enguierraws中以该类为目标。我尝试过更具体的规则想法，但这很难应用，因为我无法引用模板中的任何内容。此外，使用主体表{…}并不一定更具体。我期待着同样的规则被重新宣布生效，但到目前为止似乎还没有生效。在这个实例中，内联样式（例如在元素的decellation中包含样式）也不是一个真正的选项。好的，body table{}将始终比table{}更具体。我给了您3个选项，现在，让您选择。由于我们没有活的例子，没有HTML代码，我不能帮助你更多。

table {width:...!important}

#tableid {width:...!important}

style="width:100%!important"