香港虚拟主机
本站公告
新闻资讯
虚拟主机帮助
域名帮助
服务器帮助
邮箱帮助
建站帮助
网站推广帮助
VPS帮助
特色主机帮助
网站备案专题
会员帮助信息
代理帮助信息
成功案例
我司获香港虚拟主机排行榜十…
香港虚拟主机金秋促销活动正…
百度整治给SEO带来了新的希望
百度同时收录网站带WWW和不带…
百度对原创内容的判断标准 如…
如何建设网站 网站建设三步曲
如何挑选老域名 老域名有那些…
域名常见故障与分析
虚拟主机基本参数介绍
交换链接的技巧 谈一下选择交…
您现在的位置: 江南数联 >> 帮助中心 >> 建站帮助 >> 正文

css压缩 如何有效压缩CSS样式文件大小

  作者:admin    来源:本站原创    点击次数:29     更新时间:2012-8-29 8:12:47  
     
 
关注石头有礼
 
 

css压缩 如何有效压缩CSS样式文件大小

CSS容量过大很容易影响网页打开速度如何有效的压缩CSS就是我们今天要讲的。

去除注释和空白
Before:

/*****
  Multi-line comment
  before a new class name
*****/
.classname {
    /* comment in declaration block */
    font-weight: normal;
}After:

.classname{font-weight:normal}去除结尾的分号
Before:

.classname {
    border-top: 1px;
    border-bottom: 2px;
}After:

.classname{border-top:1px;border-bottom:2px}去除多余的分号

Before:

.classname {
    border-top: 1px; ;
    border-bottom: 2px;;;
}After:

.classname{border-top:1px;border-bottom:2px}去除无效的规则
Before:

.empty { ;}
.nonempty {border: 0;}After:

.nonempty{border:0}去除零值的单位并合并多余的零
Before:

a {
    margin: 0px 0pt 0em 0%;
    background-position: 0 0ex;
    padding: 0in 0cm 0mm 0pc
}After:

a{margin:0;background-position:0 0;padding:0}去除小数点前多余的0
Before:

.classname {
    margin: 0.6px 0.333pt 1.2em 8.8cm;
    background: rgba(0, 0, 0, 0.5);
}After:

.classname{margin:.6px .333pt 1.2em 8.8cm;background:rgba(0,0,0,.5)}压缩border、outline
Before:

.classname {
    border-left: 0 none;
    border-right: none;
    border: 0 none;
    outline: 0 none;
}After:

.classname{border-left:0;border-right:0;border:0;outline:0}色值压缩
Before:

.color-me {
    color: rgb(123, 123, 123);
    border-color: #ffeedd;
    background: none repeat scroll 0 0 rgb(255, 0,0);
}After:

.color-me{color:#7b7b7b;border-color:#fed;background:none repeat scroll 0 0 #f00}不压缩RGBA与IE滤镜中的色值
Before:

.cantouch {
    color: rgba(1, 2, 3, 4);
    filter: chroma(color="#FFFFFF");
}After:

.cantouch{color:rgba(1,2,3,4);filter:chroma(color="#FFFFFF")}去除编码声明
Before:

@charset "utf-8";
#foo {
    border-width: 1px;
}

/* second css, merged */
@charset "another one";
#bar {
    border-width: 10px;
}After:

#foo{border-width:1px}#bar{border-width:10px}压缩IE滤镜
Before:

.classname {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE 8 */
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);       /* IE < 8 */
}After:

.classname{-ms-filter:"alpha(opacity=80)";filter:alpha(opacity=80)}去除多余引号
Before:

@import url("mod-1.css");
@import url('mod-2.css');After:

@import url(mod-1.css);
@import url(mod-2.css);Before:

.classname{ background: url("img/icon.png"); }
.classname{ background: url('img/icon.png'); }After:

.classname{background:url(img/icon.png)}
.classname{background:url(img/icon.png)}不影响正常的引号
Before:

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}After:

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}对HACK的影响
支持常用HACK
Before:

#element {
    width: 1px;
    width: 2px\9;
    *width: 3px;
    #width: 3px;
    _width: 4px;
}After:

#element{width:1px;width:2px\9;*width:3px;#width:3px;_width:4px}不支持以下HACK
html >/**/ body p {
    color: blue;
}#elem {
    width: 100px; /* IE */
    voice-family: "\"}\"";
    voice-family:inherit;
    width: 200px; /* others */
}

本章关健词:江南数联 域名注册 海外虚拟主机 G享虚拟主机 国内虚拟主机 企业邮箱 网站建设 自助建站 400电话申请 微聚商

 
  版权申请:css压缩 如何有效压缩CSS样式文件大小出自江南数联dns06.com未经授权请勿转载!  
 
  • 上一篇帮助:

  • 下一篇帮助:
  •  
         

    扫一扫关注公众号有礼
    Copyright@2004-2015 江南数联 版权所有未经授权请勿复制!
    《中华人民共和国增值电信业务经营许可证》ISP证编号:皖B2-20080036 湘B2-20160056
    公司全称:永州石头网络技术有限公司(运营部)
    地址: 中国·湖南省永州市育才路158号 服务热线:400 616 9260
    安徽公司:安徽仁科信息技术有限公司 地址:合肥万和新城广场A-608 
    关注词:网站空间虚拟空间空间域名域名空间域名主机网站空间哪家好网站空间多少钱