文件拆分 是一种将单个大文件分解为多个文件的技术，这样我们每个人都可以专注于处理特定的文件，从而提高工作效率并让工作变得更轻松。
基本上，这就是将我们的代码分离到多个文件中，而不是把它们全部堆在一个文件里。想象一下，我们的网站包含三个部分：登录页面、主页面（界面）和注册页面。我们可以将登录页面的 CSS 放在一个文件中，主 CSS 放在另一个文件中，注册页面的 CSS 放在第三个文件中。然后，HTML 会引用一个索引文件，该文件包含了如何使用这三个文件的指令。
为什么要拆分文件？ 具体来说，将单个文件拆分为多个文件有以下一些优势：
拆分文件的优势：
- 无需在一个庞大的 CSS 文件中艰难查找，登录文件、注册文件和主文件分别包含了各自所需的 CSS 信息。
- 为了避免混淆，不同的文件会被整齐地组织起来。
- 我们可以根据需要打开特定的文件。
- 这有助于多任务处理，允许多个人同时处理同一个项目的不同文件。
- 对于大型项目，大多数组织都会采用这种策略。
- 在这种情况下，即使只更改了其中一个文件，浏览器仍然可以使用其余缓存的文件。这应该能提高我们网站的加载速度。
如何拆分文件？
通过为每个 CSS 文件指定特定部分，单个 CSS 文件可以被拆分为多个 CSS 文件。
例如，考虑一个单独的主 CSS 文件，其中包含登录和注册的样式表。因此，我们可以将登录样式表和注册样式表从主 CSS 文件中分离出来，而不是将它们都放在同一个文件中。
然后，我们将创建两个 CSS 文件，通过将登录样式表添加到登录 CSS 文件中，同样地将注册样式表添加到注册 CSS 文件中。
因此，将为注册和登录分别创建两个不同的文件，我们总共将拥有三个 CSS 文件：主 CSS、登录 CSS 和注册 CSS。
如何包含多个 CSS 文件： 拆分这些文件后，将它们集成到一个 HTML 文件中非常重要。
最简单的方法是先创建各个文件，然后像处理其他文件一样，单独链接每一个文件。
>
>
>
所有这三个 CSS 文件都包含在一个 HTML 文件中。
CSS 架构：
我们是否曾发现保持 CSS 样式的一致性很困难？即使是微小的 CSS 更改也可能影响 JavaScript 的功能。但是，如果在项目开始时进行仔细的规划，这些问题是可以避免的。
强大的 CSS 架构允许我们轻松地进行扩展。任何项目的开发都面临着可扩展性的挑战。因为 CSS 不包含变量、函数、抽象机制或模块机制的概念，所以它是一种用于编写样式的非常强大的语言。
但这也会对编写效率、代码维护和可重用性产生负面影响。因此，它相对容易理解和学习，但很难掌握。
例如，不同的选择器类型，如 ID 选择器、类选择器、元素选择器等，具有不同的权重，这使得样式很容易重叠和冲突。这被称为全局污染。区分类名可以防止全局冲突，但这样做会使类命名变得更加复杂。
CSS 文件组织：
文件组织是构建稳健 CSS 架构的关键组成部分。对于独立开发者或非常小的应用程序，单个文件是可以接受的。对于具有多种布局和内容类别的大型项目，或者同一设计框架下的多个品牌，最好使用模块化方法并将 CSS 分散到多个文件中。
当我们的 CSS 分散在多个文件中时，更容易将工作分配给团队。当一位开发者专注于创建网格组件时，另一位可以处理与排版相关的样式等。通过智能地划分任务，团队可以提高整体生产力。
有几种成熟的方法可以用来格式化我们的 CSS，其中一些包括：
1. BEM (Block, Element, Modifier)：
BEM 是一种非常有帮助、强大且简单的命名约定，它能使我们的前端代码更易于阅读和理解，更易于协作，更易于扩展，更健壮、更明确，也更加严格。
2. OOCSS：
OOCSS 旨在促进代码重用，这将带来更快、更有效的样式表，同时也更容易更新和管理。
OOCSS 建立在两大主要支柱之上：
- 结构与外观的分离。
- 容器与内容的分离。