如何分割單行CSS文件以提高可讀性？

Question

這不是一個編程問題，但我正在處理一個我想要檢查的第三方CSS文件，但它都是一行。我嘗試了Sublime 2文本編輯器和Eclipse CSS editor，但都不會將文件內容分割成容易被肉眼消費的樣式塊。

有什麼工具可以將單行CSS文件拆分爲多行樣式塊以提高可讀性？

Answer 1

下載並安裝代碼編輯器支架。 （它是免費的） http://brackets.io/

一旦安裝，打開它並轉到文件 - >擴展管理器。 搜索並安裝「美化」。

一旦安裝了擴展，關閉並重新打開支架。

現在打開括號中的縮小CSS文件，並轉到編輯 - >美化或按Cmd-Shift-L（Mac）/ Ctrl-Shift-L（Win）鍵。

該css文件現在應該美化，易於閱讀。

Answer 2

有許多不同的代碼「美化」這個SO問題（Sublime Text 2 Code Formatting）和後續的答案應該給你一個良好的開端。

很多看過該帖子的人發現this answer會有幫助。基本上Sergio Morlán說的是在Sublime Text中有一個內置的選項，可以在
Edit->Line->Reindent中找到。

該問題的其他答案包括使用HTML Prettify和Sublime CodeFormatter。

Answer 3

SynWrite editor（free，Windows）。轉到Options/AddonsManager/Install，輸入「css格式」並安裝項目「CSS格式」。

打開css文件後，調用menuitem「插件/ CSS格式」。

Answer 4

我發現「HTML，CSS & JavaScript Minifier/Maxifier」是一個非常有用的在線工具，可將縮小的CSS內容拆分爲樣式塊。這裏是該網站的鏈接。

<http://codepen.io/depthdev/pen/HKuLs> 

可以使用相同的工具來分割縮小的JavaScript和HTML文件。它也可以用來縮小HTML，CSS和JavaScript。