码迷,mamicode.com
首页 > Web开发 > 详细

c(css 精灵)

时间:2020-04-14 20:24:29      阅读:94      评论:0      收藏:0      [点我收藏+]

标签:上进   简单   速度   方法   精准   repeat-x   no-repeat   网页   url   

css sprites是干啥的?

简单来讲就是把多个icon(小图标),通过ps等工具合并为一张图片,从而达到减少http请求的次数,以提高网页加载速度(性能)的一种方式。

主要的优点就是提高加载速度,还有个小优点就是,减少图片命名,相信命名这件事是大家都有的困扰。

但是缺点也是有的,比如制作的时候要求位置要比较精准,使用的时候也要做好position调整

使用方法:background-image: url(...)加载图片 background-repeat:no-repeat;是否重复加载 默认是repeat 也可以通过 repeat-x 或 repeat-y决定在那个坐标轴上进行重复

然后通过background-position: 100px 100px;来实现定位

c(css 精灵)

标签:上进   简单   速度   方法   精准   repeat-x   no-repeat   网页   url   

原文地址:https://www.cnblogs.com/jzbs/p/12700303.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!