分享12个CSS开发资源，帮助大家提高 CSS 技能并提高 CSS 开发效率的资源。

有些是掌握 CSS 基础的学习资源，也有一些是可以帮助节省时间的生成器！事不宜迟，让我们一起来看一看这些超赞的资源吧！

1. Awesome CSS Learning

Awesome CSS Learning是一个GitHub存储库，里面包含的链接指向出色的CSS学习资源，资源主要是关于语言及模块。

通过链接，你可以学习的概念包括：

• 基础概念
• CSS单位
• 选择器
• 自定义属性（又称CSS变量）
• 布局
• 动画
• 其他相关概念

如果你正在寻找学习CSS基础的资源，那么一定不要错过这个资源库！

资源地址：

https://github.com/micromata/awesome-css-learning

2. CSS Waves Generator

此CSS生成器允许你创建SVG波形，你可以通过任何所需的方式使用它们。

你可以选择：

• 波的形状
• 方向
• 颜色
• 不透明度
• 弯曲度

这是一个很好用的便捷工具，可用于为网站生成部分分隔符或插图。

资源地址：

https://getwaves.io/

3. Magic of CSS

此GitHub存储库是Magic of CSS网站的存储库。根据其GitHub的描述，这是一门CSS课程，适合想要成为“魔术师”的Web开发人员。

Magic of CSS的课程分为六个章节：

• 第一章：The Box
• 第二章：布局
• 第三章：表格
• 第四章：颜色
• 第五章：排版
• 第六章：转换

从本质上讲，本课程将教授CSS的基础知识。这课程最棒的一点就是它包含了指向更多材料的链接。例如，如果你想了解有关某个概念的更多信息，可以访问链接的资源。

资源地址：

https://github.com/adamschwartz/magic-of-css

4. CSS Separator Generator

有没有想过采用特别的样式来分割网站的各个部分？此CSS生成器允许生成花式的网页分隔符。

你可以自定义分隔符，也可以实时查看预览。一旦确定要使用什么分隔符，网站就会给出HTML和CSS。

上图展示了正在工作中的生成器。这是一个超级方便的工具，可以改善我们的网站设计！

资源地址：

https://wweb.dev/resources/css-separator-generator

5. SpinKit

SpinKit是一个CSS软件包，使用它我们可以创建简单的Loading加载动画。它仅使用transform和opacity来创建平滑、外观漂亮和易于自定义的动画。

要使用SpinKit，你首先必须通过bower或npm安装。之后，你所要做的就是针对动画使用你想要的类。例如，如果你希望应用pulse动画，则需要使用sk-pulse类：

....?your?code