css - 使用更少或缩小的 CSS 的最佳实践

Question

我正在考虑在即将进行的元素中使用更少的资源，但一直在努力找出在开发过程中使用它的最佳方式。

通常在开发网站时，我会编写我的 html 和 css，然后开始在浏览器中测试它，查看它的外观、优化、重新加载并重复整个过程，直到我对一切的外观感到满意为止。

该过程的一个关键部分是使用浏览器中的检查元素功能来识别我需要更改的 CSS 片段。通常只需查看行号，我就知道我的 CSS 文件的确切位置。

但是如果我使用 Less(或任何其他组合/压缩我的 CSS 的方法)，它会使行号变得无用。我知道我可以使用 Find 来搜索代码部分，但行号要快得多。

在处理涉及其他开发人员或大型 CSS 文件的元素时尤其如此。

我只是想知道其他人是如何处理这个问题的，或者也许有更好的流程？

Answer 1

Minified CSS 真的应该只用于您网站的生产版本。当您执行测试/更改等时，这一切都应该在辅助服务器区域中的站点的某些测试或开发版本中完成，您可以在其中使用 line-numbers 版本的 css。 JavaScript 也是如此。在生产可视副本上，您希望将其缩小。在开发中，您不需要。

无论如何，您应该始终拥有 2 个 css 副本。第一个副本是作为您的开发副本的主要源副本。它包含所有格式正确的样式，其中包含换行符。另一个是已投入生产的最新缩小版 CSS。如果您需要解决某些问题，这将允许您在 2 个文件之间快速切换，假设您的网站使用某种模板交付(布局页、母版页或其他)。

缩小版仅在最终交付时有用。所有其他需求应使用主副本。在站点的服务器端部分进行配置以确定要使用的样式表可能不是一个坏主意。这样您就可以简单地更改配置设置并进入“调试”模式。