鐵人檔案
Master CSS 是由台灣團隊開發的「一種具增強語法的虛擬 CSS 語言」。
僅需透過 HTML 便可高校建構你的用戶介面和設計系統。
與 Tailwind CSS 相比之下，學習 Master CSS 更加容易，因為你只需要熟悉其結構化的語法 ( 它與原生 CSS 語法很像 ) 及不同屬性所預設的單位差異，就能夠快速地上手。
一種具增強語法的虛擬 CSS 語言 在 官網 首頁，作者將 Master CSS 定義為 「一種具增強語法的虛擬 CSS 語言」。而不是將其定義為一套 CSS...
過早抽象化 在開發網頁的時候，我們習慣為元素命名以設置元素樣式，這是導致過早抽象化的主因。以下方卡片為例： 為了設置卡片的樣式，我們需要 "花費時間...
為何不寫行內樣式就好了？ 上個單元我們用一張卡片的案例讓大家了解 Master CSS 是如何應用的，程式碼如下： <div class="ma...
什麼是 Tailwind CSS？ Tailwind CSS 的 官網 有介紹到，它是一套以 Utility-First 為基礎的 CSS 框架。 與 Mas...
透過 CDN 快速啟動 不受框架 / 平台所限，引入一行 CDN 即可啟用 Master CSS 的所有功能。<script src="http...
語意 我們可以直接在元素上面寫 CSS，但這樣子寫會充斥著單位及各種 CSS 語法標記，因此這並不是 Master CSS 的本意。 <a class=&...
像素 / rem 轉換 大部分的設計師習慣使用像素（pixel）來做為設計單位，而開發者則是習慣使用 rem 來設置網頁的文字大小、間距等等。 因此開發者就需要...
偽類 偽類是由一個冒號 : 作為前綴詞宣告，緊接著是偽類的名稱，例如 :hover、:focus、:first-child、:disabled 等等。 而 Ma...
偽元素 與上一個單元介紹的偽類不同，偽元素是由兩個冒號 :: 作為前綴詞宣告，緊接著是偽元素的名稱，例如 ::before、::after、::placehol...
通用選取器 _ 符號為選取後代節點，* 符號為所有元素。 _* 組合起來為選取到後代所有元素，常會應用在統一設定盒模型。 <body class=&quo...
