html - 使用来自不同 css 文件的相同命名类

Question

我想使用一个类。问题是我有两个包含相同命名类的 CSS 文件，一个在 first.css 中，另一个在 second.css 中，我链接 css 文件的顺序是这样的:

<link rel="stylesheet" href="bootstrap.css" />
<link rel="stylesheet" href="adminlte.css" />

adminlte.css 用于我的界面，但我喜欢 Bootstrap 表单的外观。每当我调用类 form-control 时，它都会由 adminlte.css 设置样式。

如何调用类 form-control 但使用 Bootstrap 中的类？

注意:我无法切换链接 css 文件的顺序。

Answer 1

您不能指定要使用哪个版本的类规则，除非通过加载顺序或特异性。由于 Bootstrap 使用独立的(不是嵌套或堆叠的)选择器，你不能复合类选择器来增加特异性。这使得本地覆盖成为您唯一的资源。

从库文件中获取 CSS block 并使用 style 标签将其放入您的文档中:

<style>
    .form-control {
        ...
    }

</style>

嵌入式样式会覆盖链接的样式表，因此即使选择器相同，这一个也会优先。