CSS基础 精灵图的使用

使用步骤
1.创建盒子
    <div class="one"></div>   2.使用PxCook量取图标大小,将图标的宽高设置成为盒子的宽高     CSS基础  精灵图的使用

  3.将精灵图片设置盒子的背景图片

   background: url('./images/sprites.png')   4.用PxCook量取小图标的坐标,并取负值给背景图片     background: url('./images/sprites.png') -80px -70px;     CSS基础  精灵图的使用

 注意:1.如果使用伪元素,一定要加content:'';才可使用;伪元素默认是以行内元素显示,需要转块元素或行内块元素,才能设置宽高。

      2.给单标签直接设置精灵图是无效的,可以在用div双标签包裹,给div设置精力图,并将其定位到div上

      

 

上一篇:div自动撑满剩余高度


下一篇:simulink中利用HDL Coder生成Verilog代码时候,出现Native floating point code generation cannot generate :....