css - 取消 CSS 样式

Question

我正在尝试取消缩小/取消合并我的 CSS 样式。我有一个 style.css 文件，里面有很多合并的样式，比如:

.style1,.style2,.style3{float: right}.style1{border-radius: 15px}.style2{border-radius: 0}.style3{border-radius: 10px}

我想把它转换成:

.style1{float: right;border-radius: 15px}
.style2{float: right;border-radius: 0}
.style3{float: right;border-radius: 10px}

如何取消合并缩小的 css 样式以获得这样的输出？我尝试了几种 CSS Beautifiers 和 Unminifiers，但它们并不完全符合我的需要。

UPD:这是解决方案:codebeautifier.com .为了获得与上面示例相同的输出，打开此页面，找到 Regroup selectors，将其设置为 Only seperate selectors (split at ,)，粘贴您的 CSS 和点击 Process CSS

Answer 1

如果你有Atom文本编辑器，你可以使用atom-beautify .包裹的链接是https://atom.io/packages/atom-beautify .将代码格式化为组织良好的结构。

来自你的缩小版 css , 它将其格式化为如下所示

.style1 {
   float: right;
   border-radius: 15px;
}
.style2 {
   float: right;
   border-radius: 0;
}
.style1 {
   float: right; 
   border-radius: 10px;
}

使用该原子包，您可以格式化其他流行的语言，例如 JavaScript , Python , Ruby , Swift等

希望这就是您要找的。