CSS 压缩 initial、normal

CSS 压缩在完成简单的字符替换,空白符压缩之后,还可以进一步进行特定 value 压缩。

比如:

/* 压缩前 */
.main{margin:initial}

/* 压缩后 */
.main{margin:0px}

/* 进一步压缩 */
.main{margin:0}

最后只需要占用一个字符就达到 initial 效果。

css initial 是一个特殊值,用于设置一些复杂、容易混淆的、难记忆的初始值非常有效。

/* 压缩前 */
.main{background:initial}

/* 压缩后 */
.main{background:rgba(0, 0, 0, 0) none repeat scroll 0% 0% / auto padding-box border-box}

对于这种真实样式比 initial 更长的样式可以不用压缩。

Chrome 下 css initial 对应真实值

在多个浏览器遍历设置元素 css 样式为 initial,再通过 getComputedStyle 获取真实样式,将其中相同的部分归纳到 initial 集合中,提供给压缩脚本使用,即可完成 css 特定 value 压缩。

同样可以压缩 css normal,使文件更小。

作者: 袖之欢

科技改变生活,编程改变世界。

发表评论

电子邮件地址不会被公开。 必填项已用*标注