W3C 在 2012 年 已經制定了 CSS 的變數規範，目前幾乎所有瀏覽器都支援 CSS 變數語法，透過變數的應用，CSS 程式碼將會變得更容易閱讀、管理和維護，這個單元將會深入介紹 CSS 的變數，包含宣告、使用、全域變數、區域變數和行內變數等用法。

影片重點：

• 00:01:15 宣告 CSS 變數
• 00:02:42 使用 CSS 變數
• 00:05:21 CSS 全域變數
• 00:06:48 CSS 區域變數
• 00:13:51 CSS 行內變數
• 00:16:57 CSS 變數搭配 media queries
• 00:19:48 CSS 變數搭配 calc() 數學運算函式
• 00:23:00 CSS 使用 JavaScript 操控 CSS 變數

相關參考：

• 教學文：CSS 變數 ( CSS Variables )
• 影片連結：https://www.youtube.com/watch?v=7kGYXVWS0pg

後記

這支變數的影片印象中錄了很久，過程中還真的充滿「變數」，如果畫面中是「簡報」，是屬於比較簡單錄製的，只需要把台詞講順然後即興發揮即可，但如果是「寫程式」的畫面，就比較沒有辦法和台詞互相搭配，即興發揮的成分變得很多，「變數」也就很多，有時候會因為不小心打錯字而卡住，一瞬間又無法解決問題，就只好整個重新錄製...

總之，時間越長的影片，消耗的精氣神就越多，寫程式畫面越多的影片，重錄的機率也就越高，但整體的成功率也有隨著拍攝影片的數量越多而遞減，想必是越來越熟練了～

更多參考：

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