首页 > web前端 > html教程 > css的background-url属性是怎么计算图片中各个小图的位置的?_html/css_WEB-ITnose

css的background-url属性是怎么计算图片中各个小图的位置的?_html/css_WEB-ITnose

WBOY
发布: 2016-06-24 11:53:23
原创
1797 人浏览过

如一个png中里面有三个不同颜色的小星星,怎么能准确写出每个小星星的像素位置?
如图


回复讨论(解决方案)

background-position

 <div style="background: url(http://img.bbs.csdn.net/upload/201411/20/1416475573_323694.png) no-repeat 0px -30px;width:100px;height:34px"></div>
登录后复制
登录后复制
登录后复制

http://64.233.171.161/
搜索 css 图片 位置
得:

http://www.ruanyifeng.com/blog/2008/05/css_background_image_positioning.html

http://www.w3school.com.cn/cssref/pr_background-position.asp

http://www.wibibi.com/info.php?tid=79

有 合图工具,可以生成css。

 <div style="background: url(http://img.bbs.csdn.net/upload/201411/20/1416475573_323694.png) no-repeat 0px -30px;width:100px;height:34px"></div>
登录后复制
登录后复制
登录后复制


这里面讲的很好,但是没说图片右上角的原点的坐标(?),放到规定的位置(?)。


 <div style="background: url(http://img.bbs.csdn.net/upload/201411/20/1416475573_323694.png) no-repeat 0px -30px;width:100px;height:34px"></div>
登录后复制
登录后复制
登录后复制


这里面讲的很好,但是没说图片右上角的原点的坐标(?),放到规定的位置(?)。
那个只能用高度来控制
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板