How to make css smaller?
I have a CSS file which styles the entire page, and 开发者_如何学编程it's getting Gzipped and it's minified, but it's still 200kb. Is there anything else I can do?
I took at look at your profile and found www.charliecarver.me, took a look at that and found a css file. If this is your website and the css file you are talking about, you repeat a lot of statements. For example, line 1 to 13 of your css file looks like this:
body {
/** css code... **/
}
Line 15 to 17 looks like this:
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,input,textarea,p,blockquote,th,td {
/** css code... **/
}
Line 432 to 434:
html>body #content {
/** css code... **/
}
Line 826 to 828:
body,td,th,.metadata a:link,.metadata a:visited,.navigation a:link,.navigation {
/** css code... **/
}
All that could be done with one block of code referencing the body. So, Reduce the amount of repeats you have. Just to give you an idea of what's repeating:
The elements:
- "div" appears 35 times
- "dt" appears 50 times
- "dd" appears 30 times
- "ol" appears 49 times
- "li" appears 6 times
- "yui" appears 315 times
Also, using only what you need will greatly reduce the size.
精彩评论