今天，我將分享7個幫助你提升CSS開發的資源，其中一些是學習資源，你可以使用它們瞭解CSS基礎知識，而另一些是可以幫助你節省時間的程式碼生成器！
1、Awesome-Css-Learning
地址：https：//github。com/micromata/awesome-css-learning
Awesome CSS Learning是一個GitHub儲存庫，其中包含指向出色的CSS學習資源的連結。該資源主要是關於語言及其模組的。
你可以找到學習概念的連結，例如：
1。基礎概念
2。CSS單位
3。選擇器
4。自定義屬性（又稱CSS變數）
5。佈局
6。動畫
7。網格
8。彈性盒
如果你正在尋找學習CSS基礎的資源，那麼這個資源庫非常好！
2、CSS Waves生成器
地址：https：//getwaves。io/
此CSS生成器使你可以建立SVG波形，並可以以任何所需的方式使用它。
你可以選擇：
1。波浪的形狀。
2。方向。
3。顏色。
4。不透明度。
5。“彎曲度”。
這是一個很好用的便捷工具，可用於為你的網站生成部分分隔符或插圖。
3、CSS課程
地址：https：//github。com/adamschwartz/magic-of-css
該GitHub儲存庫是Magic CSS網站的儲存庫。根據其GitHub的描述，這是一門面向想成為“魔術師”的Web開發人員的CSS課程。
CSS魔術課程分為六個章節：
第1章：盒子
第2章：佈局
第3章：表格
第4章：顏色
第5章：排版
第6章：過渡
從本質上講，本課程將教你CSS的基礎知識。這門課程最好的地方就是它包含了指向更多材料的連結。例如，如果你想了解有關概念的更多資訊，則可以使用連結的資源。
4、CSS分隔符生成器
用其樣式拆分你網站部分！此CSS生成器使你可以生成花式分隔符。
你可以自定義分隔符並實時檢視預覽。一旦確定要使用的分隔符，網站就會為你提供HTML和CSS。
上面的螢幕截圖顯示了執行中的生成器。這是一個超級方便的工具，可改善你網站的設計！
5、SpinKit
地址：https：//github。com/tobiasahlin/SpinKit
SpinKit是一個CSS軟體包，可讓你使用簡單的動畫載入微調器。它僅使用transform和opacity來建立平滑，美觀，易於自定義的動畫。
要使用SpinKit，必須透過bower或安裝它npm。之後，要做的就是使用想要的動畫類。例如，如果想使用“脈衝”動畫，則需要使用以下sk-pulse類：
這是一個方便的CSS程式包，可以在SpinKit的官方網站上檢視所有動畫。可以測試所有動畫，並在使用它們之前檢視它們的外觀。
6、陰影生成器
該陰影生成器應用程式允許你建立和自定義陰影（box-shadow）。看到下面帶有發電機的圖片！
地址：https：//shadows。brumm。af/
你可以自定義：
1。陰影層。
2。最終透明度。
3。最終垂直距離。
4。最終模糊強度。
5。傳播
這是一個很好的資源，因為你可以實時檢視陰影的外觀。如果要建立漂亮的陰影，建議使用此生成器。
7、CSS Hover
地址：https：//github。com/IanLunn/Hover
該CSS懸停包是你的連結，按鈕，標誌，SVGs，多使用懸停效果的集合。你可以根據需要使用和修改它們！
你可以透過三種方式使用此軟體包：
1。透過npm安裝。
2。透過瀏覽器安裝它。
3。直接下載CSS檔案。
如果你不想安裝它或將所有動畫新增到你的專案中，只需開啟CSS檔案並僅複製所需的效果即可。你可以在官方網站上檢視每種hover效果。
