CSS 的 @property 可以讓使用者「自訂屬性值」的 At 規則，使用方式跟「CSS 變數」非常類似，可以當作是一種「新型態的 CSS 變數」，定義屬性值之後，就能在任何地方使用這個屬性值，這個單元會介紹 CSS 的 @property 自訂屬性，最後還會利用 @property 製作漸層色動畫。

影片重點：

• 00:01:36 認識 @property
• 00:03:23 宣告自訂屬性值
• 00:04:47 使用自訂屬性值
• 00:06:08 全域、區域自訂屬性值
• 00:10:13 HTML 行內自訂屬性值
• 00:11:54 自訂屬性搭配 CSS media Queries
• 00:13:44 使用 JavaScript 操控自訂屬性
• 00:16:04 使用 @property 製作漸層色動畫

相關參考：

• 教學文：CSS @property 自訂屬性值
• 影片連結：https://www.youtube.com/watch?v=guz87hOhGBc

後記

說到這個 CSS @property 自訂屬性是我自己非常喜歡用的一個定義，特別是在做 CSS 動畫的時候，三不五時就會用到，強烈建議大家一定要把這個超強的 CSS 功能用起來喔！

更多參考：

• Youtube 頻道：https://www.youtube.com/@steam.oxxostudio
• CSS 教學大全：https://steam.oxxostudio.tw/category/css/index.html