每个页面都有唯一的css文件（使用全局文件）是一个好习惯吗？

Question

此时我使用Ruby on Rails构建了一个新网站。随着网站变得越来越大，我的css规则越来越混乱。所以我想了一种方法来提高我的css代码可读性并避免错误：

我有一个全局css.scss（SASS，类似于LESS）文件，用于重置和处理页眉和页脚等全局元素的所有页面。 对于每个其他页面，我都有一个专用的css文件。例如，对于about页面，我有一个about.css.scss文件。在about_page.css.scss文件中，代码如下所示：

.about_page {
  .othersubclass {
    .
    .
  }
}

在'about.erb'页面中，我有以下内容：

<div class="about_page">
  <div class="othersubclass">
    .
    .
    .
  </div>
</div>

这是一种好的还是坏的技巧？是否有任何已知的技术面临这个问题？

（btw RoR将所有css文件连接成1个文件，因此额外的http请求没有问题）

Answer 1

根据：http://betterfrontend.com/guides/stylesheets/

通常建议每个网站的主要部分都有一个样式表。

然后你可以在application.css.scss中编译它（这里的所有@ import都是。）

Answer 2

向网站上每个页面的根元素添加一个独特的CSS类/ id是非常好的（实际上许多CMS都这样做）但是对于每个页面创建一个单独的CSS文件听起来有点过分，通常没有很多特定于页面的CSS。

由于您提到您的构建过程将所有CSS连接到单个文件中，因此在生产环境中无关紧要，并且只是代码组织的问题。如果它适合你的项目架构（你有其他资源的每页分离），那么我猜它没关系，但就个人而言，它会采用更粗粒度的划分，例如Daniel Fischer所建议。

想想在你的情况下维护很多（几十个？）小css文件（每个0到50行？）是否方便。