一、配置 gulp的雪碧图功能没有grunt那么强大，但是类似功能也支持，功能稍微弱一些，但是也很棒 npm地址：https://www.npmjs.com/package/gulp-css-spriter/ https://www.npmjs.com/package ...

用gulp-css-spriter很简单。 第一步: 在某个文件夹用shitf+鼠标右键 第二步: npm install gulp-css-spriter https://www.npmjs.com/package/gulp-css-spriter (官网gulp插件) 第三步 ...

做前端的稍微有点经验的都知道 可以通过合并小图片 来减少请求数， 最早可能都是通过 fw、ps 等工具来手动合并， 这种方式的缺点就不吐槽了，效率低，可维护性差 等等 .... 一些很厉害的人，往往会开发出很厉害的程序，来解决重复性的劳动， 1. https ...

无意间发现了一个很神奇的事情，就是 鼠标悬停在图片上方会切换，起初以为图标是单独插入的。但发现居然是一张完整的图片。 一万只草泥马在心中奔腾。这是怎么实现的？ 后来询问得知，这是css精灵技术（sprite） 也叫雪碧图。 CSS知识点 ...

一、什么是雪碧图？ 1、我们先来看一下淘宝上面用到的雪碧图实例： a、前端展示 b、css雪碧图为 2、概念 CSS sprite在国内很多人 ...

很多网站其实都用了雪碧图，确实方便了制作，以前以为这种小图标，都是一个一个图片呢（笑） 效果图如下： 代码如下： 雪碧图是自己拼起来的 作为非计算机专业的学生，学前端一个月了，希望自己能坚持下去 ...

合并css中的图片 css代码 在路劲后面加 ?__spriter 标识要进行合并 gulp-css-spriter 默认会合并CSS中的所有图片，要按需合并则需要修改 node_modules\gulp-css-spriter\lib ...

㈠雪碧图出现的原因 当我们打算用图片做按钮的背景图片时，在设置完link，hover，active的background-image：url（相对路径）的相关功能后， 发现在第一次切换图片时，会发现图片有一个非常快的闪烁，这个闪烁会造成一次不佳的用户体验 产生的原因： 背景图片是以 ...