开发者

How to make css smaller?

开发者 https://www.devze.com 2023-02-10 01:21 出处:网络
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

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.

0

精彩评论

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