逻辑上缩小CSS的可靠方法？

Question

缩小这个：

h1 { 
    color: #fff; 
}

你会得到：

h1{color: #fff;}

但是如果你有：

h1{color: #fff;}
h1{color: #fff;}
h1{color: #fff;}
h1{color: #fff;}

缩小不一定能解决这个问题。它也不会做很多事情：

h1{color: #fff;}
div h1{color: #fff;}

我尝试csscss指出重复。但除此之外，我无法找到一种可靠的方法来消除css中的逻辑冗余。是否有一个类似于csscss的工具，甚至可能是一个可以做这种逻辑冗余的PHP库？

Answer 1

您可以使用css-purge来实现您的目标。

npm install css-purge -g // no needed if you already have it installed
css-purge -i style.css -o style_purged.css

此外，如果您使用grunt进行自动构建过程，则可以使用grunt-css-purge

Answer 2

您可以使用css minifier

通过使用css minifier：

h1{color: #fff;}
h1{color: #fff;}
div h1{ color: #fff; background: #f00;}
h1{color: #fff;}
h1{color: #fff;}

会变成这样：

div h1,h1{color:#fff}div h1{background:red}