steveyang steveyang - 20 days ago 7
CSS Question

Before deployment, is there tool to compress HTML class attribute and CSS selectors?

In current project, I was asked for compressing the HTML class attribute and corresponding CSS selectors before deployment.
For example, the code on production is:

<div class="foo">
<div id="bar"></div>
</div>

.foo {/*Style goes here*/}
#bar {/*Style goes here*/}


On deployment, I want the HTML class and corresponding CSS selectors to be substituted:

<div class="a">
<div id="b"></div>
</div>

.a {/*Style goes here*/}
#b {/*Style goes here*/}


What's the available tools there to archive this compression?

Answer

If you really want to rename classes name (keeping in mind what Madmartigan said) Google Closure Stylesheets doest that. It's an overkill, and YUI Compressor or any other minification + gzipping should give you enough performacne boost, but it can do it. You'll have to use other Closure tools to make appropriate changes to yours .js files and html templates.