測試瀏覽器原生 CSS Nesting 能不能完全做到 SCSS Nesting 的功能
巢狀CSS (CSS nesting)終於從 Chrome 版本號 120 開始支援,去年(2023/8左右) Firefox 就支援 CSS nesting 了,以前寫 SCSS 的老人們可以放心直接寫,不用再編譯嗎? 並沒有,本文就來做一些實測。巢狀結構寫法,有時候可以提升 CSS 樣式碼的易讀性和可維護性,如下圖所示,左邊是 SCSS,右邊是編譯出來給瀏覽器看的 CSS。人類也可以直接寫出右邊的 code,但是要多打了一大堆重複的部份,反觀左邊的看起來輕便不少。如果是用程式碼...