如何提高 CSS 的可维护性

1.分解你的风格。

对于小项目，按页面结构或页面内容将 ** 分成块，并在编写前对其进行注释。 例如，您可以将全局样式、布局、字体样式、表单、注释等划分为几个不同的块以继续您的工作。

2.创建 CSS 文件的索引。

为了快速了解整个CSS文件的结构，最好在文件的开头创建一个文件索引。 一种方法是创建一个类似树的索引：结构上的 id 和类都可以是树的分支。

3.定义您的颜色和排版。

我们不能在 CSS 中使用常量，但是当涉及到编写颜色和排版时，我们经常会遇到可以多次使用的类，我们可以将它们视为 CSS 中的常量。

4.设置 CSS 属性的格式。

当我们在写作时，使用一些特殊的编码风格可以大大提高CSS的可读性。 许多人有不同的编码风格。 有些人习惯于把颜色和字体的**放在第一位，而另一些人则喜欢把更“重要”的属性，如浮点和定位放在第一位。

5.缩进将是你的朋友！

为了使轮廓感觉更直观，可以使用单行来定义轮廓元素的样式。 当给定选择器中有三个以上的属性时，这可能会令人困惑。 但是，通过适度，您可以清楚地区分同一类。

为了使编写好的软件具有很强的可维护性，设计人员必须从软件方案设计开始，树立软件维护的概念，只有这样，才有可能在以后的程序设计中为软件维护预留操作空间。

1、合理的程序结构。

合理的程序结构不仅有利于软件的维护，也是团队集体创建的前提。

1 软件模块化。

根据需求，将软件划分为几个独立的模块，并定义了每个模块之间的调用关系和数据交换模式。 这样一来，创意团队的每个成员不仅可以并行独立地编写一个或多个模块，而且可以在更小的模块中进行未来的软件维护，而不必因为维护量小而修改所有软件。

2 留出一定量的自由编码用于扩展。

空白编码包括程序空白编码和数据空白编码。 由于用户需求的模糊性和设计人员对需求理解的偏差，不可能在软件编写之初就实现所有需求，这就要求设计人员在设计方案时除了完成已知的需求任务外，还要预留足够的编码空间，并使用本文后面将介绍的一些技术， 使软件的扩展变得非常容易。

3 函数体（对象）的闭包。

函数体（对象）的闭包意味着该段在程序控制方面不影响其他数据的执行，在数据方面不影响除接口数据以外的其他数据。 这对于未来对软件算法的改进至关重要，这样就可以在不意外破坏整个软件的情况下修改功能。

二是程序控制的数字化。

实际上，控件的修改不仅繁琐，而且出错的概率也会增加，降低软件的可靠性，并且不利于软件的维护，因此在软件维护中，如果控件不能修改，尽量不要修改控件。 我们设想，只要改变程序中的数据，就可以修改程序控制，这就是程序控制的数字化。

注意，在写之前，你应该有一个页面布局的大纲，写相同的属性，单独写，使用 class= 时使用"a b c"例如，如果有两个 div，它们都是 500px 宽，区别在于第二个背景颜色是黑色 AB

当然，上面只是一个例子，这么简单的一个写起来并不需要那么复杂，但是当整个页面，甚至整个网站页面，你会发现这样做会非常方便快捷。

有一个大纲，并将这个大纲划分为区域等，例如：

head .title .h1

只。 head .title的h1，总之多写点，写完了还没结束，页面效果出来了，然后优化css，哪些可以合并，哪些不需要划分区域，可以写成public。

正常书写是可以的，如果它是可读的，那就不要压缩它。

**写得少，工整，在某些地方添加应有的注释。

唯有在这座山里，云层很深，不知在哪里。

软件文档：需求分析、大纲设计、详细设计要完整、完整，以后维护和改进更容易。

注释应至少占行数的 20%

每个函数最好不超过 100 行。

还有关于函数的输入和输出用法的评论。

最重要的是多做注释，多写文档。

特别是，不要使用它"微妙的技巧"

最后，我不知道该怎么做。

主要观点如下：

1.减少动画的使用。

2. 减少 CSS 中的计算量。

3.压缩CSS

4. 使用CDN