开发者

How to Minify CSS to its Absolute Minimalistic Essence?

开发者 https://www.devze.com 2023-02-17 17:45 出处:网络
Dear folks, staring at the minified CSS I put together so proudly the othernight, I desparately tried to remove more chars here or there, like those wasted whitespace: \" \" meanwhile the more I stare

Dear folks, staring at the minified CSS I put together so proudly the other night, I desparately tried to remove more chars here or there, like those wasted whitespace: " " meanwhile the more I stared at this code, the more I started to see patterns, clearly emerging from these bodies, asif this was the absolut开发者_运维知识库e minimum, plus some hidden message Now let me get to the point for this question is already too contaminated with nonvital letters already: Is there a way we could further minify my otherwise humungously gigantuous monster css file into a more bandwith friendly, really small file? Much appreceated!

How to Minify CSS to its Absolute Minimalistic Essence?


  1. If your css is hosted on the same site as your images, use relative paths in your url()s: background:url(/path/to/file.png)
  2. Use shorthand where applicable: margin:0 instead of margin:0px 0px 0px 0px
  3. Try running the CSS through a real minifier such as the YUI Compressor
  4. As a last resort, shorten your class names in the CSS and the related HTML
  5. Pass it to the left...


You've got a bunch of "0px" values in there, just make them "0" to save a couple of characters each there. Also, your negative text-indents could be -999em instead which saves a couple of characters and equals roughly the same depending on the base font-size.

And as @ithcy said, use short relative paths or re-host at imgur and reference as url(//imgur.com/name.jpg) instead will save some bytes too.

Edit: Duh, I just re-read @ithcy's answer and it mentions most of what I said anyway.

0

精彩评论

暂无评论...
验证码 换一张
取 消