为什么图像精灵采用负坐标作为背景位置

时间:2012-10-31 11:12:41

标签: css css3 css-sprites

我知道Image sprites中css中的流行功能。但我不明白为什么我们必须指定负背景位置坐标。我知道任何图像精灵左上角都是原点。我不明白为什么会这样?为什么不是其他角落,为什么不是图像精灵的中心。如果有人知道答案。请帮忙

2 个答案:

答案 0 :(得分:4)

我们需要一个坐标系来描述图像。计算机成像中使用的坐标系基于位图,根据定义,位图基于网格(行和列),其左上角有orign(x = 0,y = 0)(与笛卡尔相对)坐标系,左下方有正空间的原点。)

答案 1 :(得分:3)

您使用负坐标,因为您希望图像“稍后开始”。

例如,我有一个100px乘100px的图像,以及一个从坐标40,40开始的正方形

我想将图像向左和向上移动40个像素,因此广场进入我的视野,我通过background:url('sprite.png') -40px -40px;

来做到这一点