CSS 屬性速查
常用 CSS 屬性離線速查:取值範圍與程式範例,依版面/文字/背景/邊框/動畫分類。
CSS 屬性速查
常用屬性 · 取值 · 程式範例
沒有符合的屬性
使用說明
📖 工具介紹
CSS 屬性速查是一款面對前端開發者與樣式除錯情境的離線參考工具,把日常寫樣式時最常翻閱的屬性整理成左側分類、右側清單的雙欄配置。寫網頁時,我們常記不清 justify-content 的可選值、box-shadow 四個參數的順序、line-height 到底該寫單位還是純數字。本工具把這些高頻屬性依版面、文字、背景、邊框、動畫五大類收納在左側導覽,點擊即切換,右側清單即時顯示該分類下每個屬性的語義說明、常用取值膠囊與可直接複製的範例程式碼。頂端搜尋方塊支援依屬性名、取值或說明關鍵字即時過濾,例如輸入 flex 就能看到所有與彈性版面相關的屬性。所有範例皆採用深色程式區塊呈現,方便對照你的樣式表,複製程式碼按鈕可一鍵匯出目前可見的範例片段。
✨ 功能特點
- 收錄版面、文字、背景、邊框、動畫五大類高頻 CSS 屬性
- 每條屬性含語義說明、常用取值膠囊與可直接複製的範例程式碼
- 左側直向分類導覽一鍵切換,行動裝置自動摺疊為橫向按鈕
- 頂端搜尋方塊依屬性名、取值或說明即時過濾
- 深色程式區塊與取值膠囊層次清晰,方便快速對照
- 支援複製範例程式碼與下載 TSV 清單,方便離線查閱
📝 使用方式
- 在左側導覽點擊需要的分類,或頂端輸入屬性名搜尋
- 在右側清單閱讀每個屬性的語義說明與常用取值
- 從程式區塊中複製需要的範例片段
- 用複製程式碼或下載清單匯出目前篩選結果
- 點擊清空篩選可回到全部分類檢視
⚠️ 注意事項
- 取值精簡:取值膠囊列出最常用寫法,完整取值列表請參閱 MDN
- 單位建議:字級建議 rem、間距建議 px,視專案規範而定
- 相容性:grid、sticky 等新特性在舊瀏覽器可能需要降級方案
- 完全離線:所有資料內嵌本機,不發出任何網路要求
- 非全集:本表聚焦高頻屬性,完整屬性請查官方規範