雪碧图怎么在代码里面使用

来源:4-1 经验总结

CC陈十一

2019-04-01 14:23:48

有这么多图片,如何精确定位到某一张特定的图片

写回答

1回答

好帮手慕夭夭

2019-04-01

你好同学 , 在ps中打开图片测量一下要使用图标的位置 .例如如下:

假如要使用第三个图标

http://img.mukewang.com/climg/5ca1c6b600017f3000530103.jpg

它的background-position 属性值是根据是铃铛在雪碧图的位置 :

也就是铃铛距离雪碧图左边和上边的位置 , 同学可以使用ps测量一下 . 如下 :铃铛距离左边0px , 距离上边44px. 

http://img.mukewang.com/climg/5ca1c6de0001dfa200410110.jpg

所以要想铃铛移动显示在元素上边 ,需要向上移动44px , 所以需要设置负值 , 如下设置:

http://img.mukewang.com/climg/5ca1c6f000015d0803070019.jpg

侧栏的话可以像视频中那样 ,如下 , 使用如下矩形在绘制的时候就能查看宽高

http://img.mukewang.com/climg/5ca1c70c0001596e11110670.jpg

希望对你有帮助 , 祝学习愉快 ,望采纳 .

0

0 学习 · 40143 问题

查看课程