问如何更喜欢css文件而不是另一个？
EN

Stack Overflow用户

提问于 2021-06-20 08:31:00

回答 1查看 75关注 0票数 1

我有两个css文件

import "bootstrap/dist/css/bootstrap.min.css";
import "semantic-ui-css/semantic.min.css";

我更喜欢在设计中使用引导程序的设计，因为它们引用的是相同的东西，您如何才能在代码行中比站点更喜欢引导呢？

reactjs

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-06-20 10:19:33

通常，在这种CSS冲突的情况下，我所做的是汇总导致冲突的元素所使用的类，然后只提取这些类，并将它们作为内部样式(在标记中)，因为您知道的CSS首选项是in-line > internal > external和id > class > element，还有!important有先例。有关更多信息，请参阅此处- What is the order of precedence for CSS?

作为例子-

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<body>
<style>
.text-primary{
    color: black !important;
}
</style>

<div class="container">
  <h2>Contextual Colors</h2>
  <p>Use the contextual classes to provide "meaning through colors":</p>
 
  <p class="text-primary">This text is important.</p>
  <p class="text-success">This text indicates success.</p>

</div>

</body>

</html>

您知道，我不想要text-primary类，所以我在内部用!important重新定义了它，因为它的bootstrap css需要!important来重写它。

类似地，您可以提取sidebar(menu)所需的类，然后在内部定义它们以覆盖外部css。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/68054047

复制

相似问题

问如何更喜欢css文件而不是另一个？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何更喜欢css文件而不是另一个？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何更喜欢css文件而不是另一个？
EN