CssGaga – CSS 优化

保留空格(IE6 bug)

Before:

.classname:first-letter { font-weight: bold; } 
.classname:first-line { font-weight: bold; }

After:

.classname:first-letter {font-weight:bold}
.classname:first-line {font-weight:bold}

中文字体Unicode编码

Before:

.classname { font-family: 宋体; }
.classname { font-family: 黑体; }
.classname { font-family: 微软雅黑; }

After:

.classname{font-family:5B8B4F53}
.classname{font-family:9ED14F53}
.classname{font-family:5FAE8F6F96C59ED1}

注:支持以上三种字体

删除不安全字体sans-serif(IE8 bug)

Before:

.classname { font-family: 宋体, sans-serif; }

After:

.classname{font-family:5B8B4F53}

避免 IE6/7 Matrix BUG

BUG详见:http://www.imququ.com/post/thebugof_ie-matrix-filter.html
Before:

.classname {filter:progid:DXImageTransform.Microsoft.Matrix(M11=-0.707,M12=-0.707,M21=0.707,M22=-0.707,SizingMethod='auto expand');}
.classname2{color:red;} /* IE6/7中会出现.classname后的代码会无法解析的BUG,解决方法是将逗号后面加个空格 */

After:

.classname {filter:progid:DXImageTransform.Microsoft.Matrix(M11=-0.707, M12=-0.707,M21=0.707,M22=-0.707,SizingMethod='auto expand');} .classname2{color:red;}

cursor生成根路径(IE6&7 bug)

Before:

{cursor:url('img/absolute/pre.cur'), auto;}

After:

{cursor:url(http://imgcache.qq.com/qzonestyle/css/img/absolute/pre.cur),auto}

生成IE6 alpha滤镜

Before:

background-image:url(img/absolute/app-854x523.alpha.png);  

After:

background-image:url(img/absolute/app-854x523.alpha.png);_background-image:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://qzonestyle.gtimg.cn/qzonestyle/xiaoyou_portal_v2/css/absolute/app-854x523.alpha.png',sizingMethod='crop');  

注:

cur及png文件所在的absolute文件夹须放在与css同级的img目录中,且引用时为相对路径,比如

img/absolute/pre.cur  
img/photo/absolute/pre.cur  

需在配置文件里设置下面两项的对应关系

<add key="pathSource" value="E:\isd_webrebuild_rep\qzonev5_proj\trunk\qzonestyle" />  
<add key="webSiteUrl" value="http://imgcache.qq.com/qzonestyle" />  

返回CssGaga – 帮助索引