CSS 格式化
在瀏覽器中美化並整理雜亂或壓縮的 CSS。
即時 — 邊輸入邊格式化
範例
美化壓縮的 CSS
輸入
.btn{color:#fff;background:#000;padding:8px 16px;}輸出
.btn {
color: #fff;
background: #000;
padding: 8px 16px;
}整理不一致的間距
輸入
a{color:blue;} a:hover{color:red;}輸出
a {
color: blue;
}
a:hover {
color: red;
}關於此工具
這個免費線上 CSS 格式化工具把雜亂或壓縮的樣式表變成整潔、縮排整齊的 CSS——一個快速的 CSS 美化和格式化工具。貼上你的 CSS,選擇縮排樣式,格式化結果立即出現。一切都在你的瀏覽器中執行,不上傳,你的程式碼絕不會離開你的裝置。
使用方法
- 把 CSS 貼到輸入框(點擊範例試用)。
- 選擇 2 空格、4 空格或定位字元縮排。
- 在右側輸出框查看美化後的 CSS。
- 用複製按鈕複製結果。
何時使用 CSS 格式化工具
從建置好的套件複製壓縮 CSS、接手間距不一致的樣式表,或在編輯前想讀懂某條規則時,重新格式化很有用。一致的縮排讓選擇器和巢狀一目了然,diff 也保持乾淨。
常見問題
這個 CSS 格式化工具免費嗎?
免費 — 無須註冊、無限制的完全免費線上 CSS 格式化和美化工具。想格式化和縮排多少 CSS 都行。
我的 CSS 會上傳到伺服器嗎?
不會。這是不上傳的工具——你的 CSS 完全在瀏覽器中格式化,所以程式碼絕不會離開你的裝置。對私密或內部樣式表也安全。
CSS 美化器做什麼?
它把每條規則和宣告各放一行,正規化大括號、冒號和分號周圍的間距,並重新縮排一切,讓壓縮或雜亂的 CSS 變得易讀。
我能選擇縮排嗎?
能——選 2 空格、4 空格或定位字元。你的選擇會記在瀏覽器中,下次仍在。
它能處理 SCSS 或 Less 嗎?
由於結構類似 CSS,它在縮排和整理方面能很好地處理大多數 SCSS 和 Less 語法。它是格式化而非編譯——不會展開巢狀或變數。
它能展開壓縮的 CSS 嗎?
能。貼上單行或壓縮的樣式表,它會把它展開成正確縮排、易讀的規則集。
離線和手機上能用嗎?
頁面載入後它在本地執行,所以在網路不穩時仍能運作,版面在手機和平板上完全響應式。
相關工具