Html 如何修改和调试第三方提供的CSS

我是一个完整的堆栈开发人员。但像许多完整的堆栈一样，我更喜欢后端。在我的职业生涯中，我发现开发人员往往会以某种方式将CSS工作外包出去。基本上有两种方式——通过雇佣中介机构或指定某人来处理CSS。在我看来，创建和改进一些基本的东西是很典型的，但如果我们遇到复杂的CSS问题，我们只需要打电话给代理或我们的前端专家

我的问题是关于使用其他人创建的CSS项目的策略。只要一个人只需要找到一个应该用于某个元素的类，这并不是什么大问题。但是，当人们开始修改它时，大泥球开始摇晃

在后端，这很容易。如果您严重破坏了某些内容，它将无法编译。如果你以一种更微妙的方式破坏了某些东西，它很快就会清晰可见，并且很容易调试，因为它会一步一步地向你展示执行的内容。但是当我开始修改CSS时-哦，天哪流行的情况是，我有一些可以在普通html文档上工作的东西，但当我把它放在一些更大结构的元素中时，它就停止工作了。然后，一个小时又一个小时，我在努力定位导致它的CSS行

---

你知道有什么方法和策略可以让它变得简单吗？

有一种方法可以修改第三方CSS，你想修改的类将它们写入你的CSS文件并应用！每个与第三方css类发生冲突的属性之后都很重要

例如：

在第三方CSS中有一个类：

.demo{
   width:100px;
   color:#666666;
}

现在你想改变它的宽度和字体颜色，所以你在你的css中这样写

.demo{
       width:80px!important;
       color:#ff0000!important;
    }

---

希望这会对您有所帮助，让我进一步了解任何问题，我可以尝试通过提供一些解决方案来解决。谢谢

您可以使用chrome浏览器中的“firebug”或“开发者工具”等浏览器工具进行调试。。。。不确定你是否将其外包是什么意思，这不是一个直接的技术问题基本上，网站的CSS是一个框架，你问的是如何理解另一个开发人员编写的框架。我相信你知道这里没有魔术，特别是如果框架一直在变化的话。但无论如何，调试web前端代码的一个非常重要的部分是使用浏览器中的开发工具“inspector”。在那里，您可以实时调试HTML和CSS，更改内容，查看原因。@Roope我当然知道提到的工具并使用它们，尽管搜索大量CSS仍然是一个问题。嗯，我想知道一些魔术：）@Landeeyo好吧，嗯…：为什么你需要搜索大量的CSS？如果检查网页上的元素，就会看到该元素应用的CSS。在那里，您可以实时调试、选中/取消选中内容或更改值，当您找到要更改的内容时，您可以在inspector中看到文件名和行号。所以你应该马上知道去哪里而不必搜索大量的东西？或者没有？UI开发的问题是，显然，计算机没有办法知道事情应该是什么样子的。因此，为UI内容创建自动调试有点困难。您必须手动查看事物的外观是否符合您的要求。前端人员更像艺术家和设计师，而编码正是实现这些目标的途径。我听说过！这很重要，当然也很有用。然而，我正在寻找一种方法，以找到破坏代码的确切原因，而不是重写它。找到破坏代码的代码，最好的方法是使用firebug，我认为没有任何自动工具可以为破坏代码的CSS类带来结果。。此外，它是手动检查，我强烈反对使用

！重要信息

，因为它破坏了CSS内置的特殊性引擎。相反，应用相同的选择器或更具体的选择器。还要记住，当两个选择器相同时，最后一个实例将优先，因此在使用相同选择器的第三方实例之后应用样式表也可以覆盖不需要的样式。