🎨

CSS 屬性速查

常用 CSS 屬性離線速查:取值範圍與程式範例,依版面/文字/背景/邊框/動畫分類。
屬性 📂 查詢 👤 ToolWorld 🏷️ v1.1.12
載入中...

CSS 屬性速查

常用屬性 · 取值 · 程式範例

沒有符合的屬性

使用說明

📖 工具介紹


CSS 屬性速查是一款面對前端開發者與樣式除錯情境的離線參考工具,把日常寫樣式時最常翻閱的屬性整理成左側分類、右側清單的雙欄配置。寫網頁時,我們常記不清 justify-content 的可選值、box-shadow 四個參數的順序、line-height 到底該寫單位還是純數字。本工具把這些高頻屬性依版面、文字、背景、邊框、動畫五大類收納在左側導覽,點擊即切換,右側清單即時顯示該分類下每個屬性的語義說明、常用取值膠囊與可直接複製的範例程式碼。頂端搜尋方塊支援依屬性名、取值或說明關鍵字即時過濾,例如輸入 flex 就能看到所有與彈性版面相關的屬性。所有範例皆採用深色程式區塊呈現,方便對照你的樣式表,複製程式碼按鈕可一鍵匯出目前可見的範例片段。

✨ 功能特點


  • 收錄版面、文字、背景、邊框、動畫五大類高頻 CSS 屬性
  • 每條屬性含語義說明、常用取值膠囊與可直接複製的範例程式碼
  • 左側直向分類導覽一鍵切換,行動裝置自動摺疊為橫向按鈕
  • 頂端搜尋方塊依屬性名、取值或說明即時過濾
  • 深色程式區塊與取值膠囊層次清晰,方便快速對照
  • 支援複製範例程式碼與下載 TSV 清單,方便離線查閱

📝 使用方式


  1. 在左側導覽點擊需要的分類,或頂端輸入屬性名搜尋
  2. 在右側清單閱讀每個屬性的語義說明與常用取值
  3. 從程式區塊中複製需要的範例片段
  4. 用複製程式碼或下載清單匯出目前篩選結果
  5. 點擊清空篩選可回到全部分類檢視

⚠️ 注意事項


  • 取值精簡:取值膠囊列出最常用寫法,完整取值列表請參閱 MDN
  • 單位建議:字級建議 rem、間距建議 px,視專案規範而定
  • 相容性:grid、sticky 等新特性在舊瀏覽器可能需要降級方案
  • 完全離線:所有資料內嵌本機,不發出任何網路要求
  • 非全集:本表聚焦高頻屬性,完整屬性請查官方規範

相關推薦

⏫︎