如何在不覆盖现有CSS的情况下包括多个CSS？

Question

我正在使用模板（A）。这有一些CSS文件，我想在此模板中包含另一个模板（B），而另一个模板也有一些CSS文件。通过将模板B的css包含在A中，由于模板B的新CSS，某些形式看起来有所不同。

如何在不替换某些表单的情况下包含两个模板的所有CSS文件。...我可以为一个CSS设置优先级吗？还是有一种工具可以放置更多CSS文件，将所有CSS文件压缩为一个？

或者我可以仅将一个CSS文件用于一个DIV吗？

Answer 1

我不确定您要做什么。 但是，假设您要链接多个css文件到页面。您可以使用CSS选择器的优先级。例如，ID的优先级高于类。您也可以使它们更具体。

例如：

body ul li span {
  Color: red;
}

Span {
  Color: blue;
}

此处跨度应为红色

Answer 2

您应该尝试仅将登录页面（模板（B））所需的CSS包含到登录页面HTML中，例如：

index.html 文件：

<link rel="stylesheet" href="templateA.css">

login.html 文件：

<link rel="stylesheet" href="templateB.css">

目标是仅避免两个模板之间的冲突，而不能在同一页面上同时使用它们，这将导致大量错误并严重降低网站速度。
  如果我不清楚什么，请随时在评论中问我。

Answer 3

CSS的意思是“层叠样式表”。在此，“级联”表示如果发现的内容比上一次的优先级高出两倍。因此，最后链接您想要优先级的CSS文件。您也可以使用！important赋予优先级。例如：

color: red !important;

这里将整体使用红色。