如何优化CSS文件的速度

前端之家收集整理的这篇文章主要介绍了如何优化CSS文件的速度前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想知道如何优化CSS文件以加快加载速度,目前我的CSS文件是2400行并且大小为54kb.没有任何图形元素比4kb大,所以我相信CSS是reasson我的网站渲染/加载缓慢.

这只是主要的CSS,在某些页面上,我正在加载其他CSS文件.

解决方法

这是很多CSS.虽然CSS“缩小”工具是一个好主意,但您可能希望手动传递文件并查找可以组合的规则.例如:
margin-top: 10px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 5px;

可以简化为:

margin: 10px 5px 0 5px;

甚至更进一步:

margin: 10px 5px 0;

同样,边界可以减少:

border-width: 2px;
border-color: #123456;
border-style: solid;

这可以表示为:

border: 2px solid #123456;

背景,填充和字体是可以编写的一些其他规则,使得它们更短且更有效.这是一篇关于CSS Shortcuts的好文章.

CSS minifiers是有用的工具,但我不确定他们是否能够将代码重新排列为快捷方式格式.

猜你在找的CSS相关文章