Question

我下载并自定义了一个符合我需求的网站模板。该模板附带了许多文件夹和文件，包括js和bootstrap文件。一切似乎工作正常，直到我尝试集成一个PHP脚本，它也恰好是设计并包含许多js和bootstrap文件。

我用firebug来调试冲突。

当我将页眉和页脚文件与关联的js和bootstrap文件一起包含时，脚本会丢失大部分设计（即导航面板）。我注意到模板bootstrap css文件中定义的类与脚本自带的bootstrap css文件中的类相同。

我该如何解决这个问题？

有没有办法排除主要网站引导程序文件影响已安装的脚本，反之亦然？

Answer 1

我没有使用过bootstrap并且对它知之甚少，但基本上如果你想保存引导程序样式，只需在脚本之后加载它们。

这样的事情：

<link rel="stylesheet" href="css/YOURCSS.css" />
<script src="js/YOURJS.js"></script>

<link rel="stylesheet" href="css/bootstrap.css" />
<script src="js/bootstrapJS.js"></script>

Answer 2

这些是你告诉你的文件......

public_html/bootstrap/css/bootstrap.min.css
public_html/folder/subfolder/script/theme/css/bootstrap.css

<link type="text/css" rel="stylesheet" href="/bootstrap/css/bootstrap.min.css"/>
<link href="/folder/subfolder/script/theme/css/bootstrap.css" rel="stylesheet"/>

两个假设：

代码中的两组文件都相同。 那么，没问题，但事实并非如此。
两个集合名称相同但内容不同。然后，如果这些文件包含类似名称的类（或#id规则），则所有规则将以先到先得的方式排序，如果单个属性有多个规则，则将应用该属性的最后一个规则

示例：

h1,h2, .heading, #heading{
font-family:georgia; /* from first file in the include order they are specified in html */
font-family:verdana; /* from second file */
font-family:arial; /* from third file */
},

然后，

最后一条规则：font-family:georgia; /* from the third file */将被应用。

如果你愿意，调试这些东西会更难。因为你不能保证他们如何合并的方式。如果所有代码都是由您自己编写的，那么您可以使用像this这样的缩小器来删除所有重复项。但事实并非如此。

最后，你说一切似乎工作正常，直到我尝试整合一个也正好被设计并包含许多js和bootstrap文件的php脚本。

在这里，最好从与php脚本文件夹一起删除的名称中删除类似的CSS类。

2个bootstrap.css文件之间的冲突

2 个答案: