正文
CSS基础 精灵图的使用
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
使用步骤
1.创建盒子
<div class="one"></div>
2.使用PxCook量取图标大小，将图标的宽高设置成为盒子的宽高
3.将精灵图片设置盒子的背景图片
background: url('./images/sprites.png')
4.用PxCook量取小图标的坐标，并取负值给背景图片
background: url('./images/sprites.png') -80px -70px;
注意：1.如果使用伪元素，一定要加content：'';才可使用；伪元素默认是以行内元素显示，需要转块元素或行内块元素，才能设置宽高。
2.给单标签直接设置精灵图是无效的，可以在用div双标签包裹，给div设置精力图，并将其定位到div上
