哦关注我总有一天变大牛。
好，到这儿呢咱们来看这道题。
他问的是c s s雪碧图是什么。
那通常呢我们会把雪地图又被称为叫精灵图啊，就好比说张三一样，大名呢叫张三，小名叫狗蛋啊，我叫他张三答应我叫狗蛋，他也理我哎，就这意思。
然后其次问问这东西它到底有什么样的优点以及缺点。
好，在这呢咱们先来说第一个事情啊就是是什么？说白了，他就是把把多个小图标合并成一张大图片，啊这就是雪地图是什么。
好，下面呢我给大家看一个例子啊。
就这样的一些东西呢中呢可能会用到，我有两种方式呢去做。第一种方式呢就是每一个。
小图标我都单独的弄一个图片，比如说这个叫一点ppt，二、三、四、五、五点ppt、六点ppt，带头弄啊有多少个我就弄多少个图片，这是第一种方式。
第二种方式呢就是通过雪地图的方式是吧，把你所有的图标啊或者说部分图标，我给你弄成一张大图片，这就是说把多个小图标合并成一张大图片，啊这是两种方式。
那么写地图呢说的是第二个方式啊，多个合并成一个。那么这样做的话呢他看的一些优点或者缺点啊，就是下边咱们要说的优缺点问题。
那么在说优缺点之前呀，咱你先用下啊，可能一些小伙伴儿诶这是啥呀，怎么？
啊这呢咱们稍微说一下啊，这很简单啊，比如说我这儿有d i v，诶不是d iv，为什么？
不给我来个符号啊，这少一个sky去哪儿啊？
好，然后有个dna。行，我给d mv呢加一个样式啊，刚才我去量了一下子，这个地方呢图标差不多是十七，宽、高都是暑期啊。啊然后呢在这儿我加一个背景图，这个背景图呢叫蛮钮。好，我们看一下，来，我这儿呢给它去一下重复。来，刷新。
你看现在呢有一个这样的小图标了是吧。行，那么其实这样呢它是有问题的啊，有什么问题呢？例如说我要加载的这张啊，我把背景图给他成啊，背景啊这块我给它弄成一个黑色吧，要不然看不出来了，或者说弄成一个粉色，尽量是可以看。出来的。啊我现在去加点这样。
那么加载这张图，我应该写什么样尺寸才能加载到这个图呢？它这样来看啊。我给大家画一个图。现在我的mango点ppt呢它是这么老大对吧，它是在这儿啊然后这儿呢有一个图、两个图、三个图、四个图，可能画得不好啊，有这么多图哎，每一个都是实际要素。然后这是我的页面，我希望呢我这盒子比如盒子在这儿啊，我希望这盒子呢放这两组片。
那它是怎么放呢啊你如果什么都不写的话呢，它这个地方是这样重合的，但能够能理解我的意思吧？就这样重合的。就你不写的话呢，它x和y呢是零和零这个点。那其实呢你用的是这张雪地图啊，动这个man点ppt，你要让它展示到这个盒子上。
你得这么动啊，你得往左走哎，注意往左是正值还是负值啊。往左走是减哈，是这个盒子啊，看好是在manager边界啊，他动所以说它是减的，因为人家本身是在这儿的，你人家往左走就减，再往上走也是减哎最终呢展示到这儿，和我这盒子这儿重合，啊最终显示了这张图了。所以说呢你是要让这个东西呢他啊这个写地图，他去跟着这个盒子去走啊，你要展示。
换句话说你要展示这得找，那该怎么办？也是一样的啊，本身在这儿，你往左走啊，再往上走，最后到这个位置上差不多是吧哎，就这意思。好，所以说我我们要展示是这张图展这张图，它距离左。lg走多远啊？
量一下。二十三差不多啊那就是我们这儿写下。啊它的这个x轴那可能就是负的，注意啊，减啊，二十三天。
好。他的往从下往上走多少，那我们把这块量一下啊，一直到头八十八，看到没有？
高是八十八哎，那就是八十八负的啊八十八，因为往上走。好，这时候我们再来看刷新，你看就这张图了，来对比一下啊。
诶刚才我量了在哪啊这个，就这个图。啊可能有点看不清楚啊，因为它是白色，你看这个黑色就行了是吧，这儿这儿这儿花纹儿是吧这儿这儿这儿，正好就能加载到了呀，哎就这个意思。
好，那我们知道这个雪地图的一个使用啊。翻过头我们再来说它的一个优点、缺点。
那我这儿呢就直接的或者准确的把这个优点和缺点都给大家去说一下，咱直接啊进入他的。
优点是什么呢？啊减少了减少了atp啊请求的次数，啊提升了。
大家想一想，我弄二十个图标，你要加载二十张图加载二十次。
我把你们都弄成一张啊，一就写地图，我只需要加载一次就行了。
那刚才咱们说的两种方案嘛，第一次第一种方案，那可能你加载页面需要比如你有五十、五十个这张小图标，那有将近五十次那么。
那写地图呢加在一张大图上就可以了，那么就减少你的请求次数，提升了我的性能啊。
那这是它的优点，当然缺点是什么？
啊缺点，如果说这张图片哈它的某些元素要改了，或者位置上可能ui要调动发生一些变化。
比如把这个内容加宽了、加高了啊，或者说呢某个元素要去掉，要改成其他的。
可能位置上各种各样东西发生了改变，那么则会导致它的维护啊就是呃维护比较差。
啊为什么维护要上呢啊例如图片啊、位置呃进行修改，啊或者内容宽高，是吧都会造成维护比较。啊因为你改动了，例如说啊我这儿左边给你加了个白条，那是不是你的所有的line值都不对了？
啊你又得重新量，或者说你统一要改啊，或者这张图片他可能下这了，那你就要重新去改它位置啊，这就很麻烦的一点，它维护呢比较，啊或者说维护起来比较。
还有就是说你每个图每个图要去量啊，它既也是比较麻烦的啊，因为每个图的位置你要找到，这也是比较麻烦的。
但是呢我就不把它写到缺点这块，因为那些东西呢都是正常东西是吧，既然要用它啊，所有东西几乎都是有德必有失嘛，有缺点必有优点有优点必有缺点，基本是这样啊，很少有东西全优点，没有缺点是吧。
人又怎么样呢是吧人也有很多缺点或者优点嘛哎所以说呢根据你的情况去定啊。但是我们要知道css的水平图或者精度图，它是。
啊它能解决什么样问题，它的优缺点啊分别有哪些，这个事我们一定要知道。
好，那么针对于这个问题呢，咱们就先说到这里。