覆盖所有现有的 CSS 样式？答案

【问题标题】：Overriding all existing CSS styles?覆盖所有现有的 CSS 样式？
【发布时间】：2021-12-15 13:59:37
【问题描述】：

我有一个简单的问题，目前我还没有找到明确的答案。我想更改已经应用了广泛 CSS 的网站的样式。我无法删除或编辑这些现有文件，只能添加我自己的。有没有办法通过新文件覆盖所有现有的 CSS 样式，甚至删除它们？或者是通过使用更具体的选择器、!important 关键字等来单独覆盖每种样式的唯一解决方案？

我对网页设计很陌生，所以希望您能原谅这个（也许很简单）的问题。

【问题讨论】：

我不认为你可以用 css 轻松做到这一点。不过有一些javascript 解决方案。这对你来说是一个选择吗？
这就是我的想法，尽管我希望有一个简单的解决方案。遗憾的是，我无法在我的情况下使用 JavaScript，但感谢您的回答。
使用 JS...您将消除大部分头痛
@ViaTech 虽然我很欣赏这个答案并试图提供帮助，但就像我说的：这不是我想要的，因为我做不到。我所能做的就是添加一个 CSS 文件。
@RalphBear 那么你唯一的解决方案是将你的 CSS 放在你想要覆盖的 CSS 下面...使用最接近元素上方呈现的 CSS，所以如果你在 @ 中定义了 .my_color{color:blue} 987654324@ 你可以在下面放置一个main.css 和.my_color{color: green} 并且任何具有该类的元素最终都会有绿色文本......这有效吗？......你只需要覆盖你想要的类......这个像 MDBoostrap 这样的公司如何进行额外的设计（以及额外的 JS）

标签： css

【解决方案1】：

是的，重要的可以覆盖它，但也有特殊性覆盖。示例

<div class="main">
  <div class="test-wrapper">
   <div class="box s-1 h-1">

   </div>
  </div>
</div>


.main .test-wrapper .box{}

如果我想覆盖它

增加特异性

.main .test-wrapper .box.s-1{}

https://www.w3schools.com/css/css_selectors.asp

【讨论】：

是的，我知道这一点。我的问题是我只能添加 CSS 文件，不能编辑任何现有文件或添加任何 HTML 或 JavaScript。就像我说的，我知道的唯一解决方案是使用更具体的选择器来覆盖样式。但是，这将非常乏味，这就是我发布此问题的原因。
你也可以增加现有元素的特异性，这就是我的意思
但是在你的例子中，你添加了一个新的 HTML 类，我不能这样做。
是的，增加特异性不编辑答案
为什么不推荐 !important？