在stackoverflow的另一个问题中： 关于悬停图像缩放
他们告诉您如何在悬停时弹出图像。这个jsfiddle给出了答案：http: //jsfiddle.net/uCtHh/1/
在代码中，图像大小是悬停时50px更改为。100px然而，悬停时给出的负边距仅为-20px。
当图像的大小增加 50 时，它不应该是 -50px 吗？
问问题
123 次
4 回答
2
你可以试试看将边距更改为 -50px 时会发生什么。
当margin left变为-50px时，右边的图片很大一部分会在左边的上面。左边距确定图片与页面左侧或左侧项目之间的距离。因此，如果您不希望图片位于左图上方，您甚至可以将其设置为 10px。
于 2013-07-14T14:30:25.600 回答
2
基本上，编写 jsfiddle 的人都希望它看起来像图片从中间向外扩展。直观地说，这意味着左边距和上边距应该是-25px。这是因为每个维度都增长了 50px，但是您希望它从中心向外扩展，所以每边应该是维度增长的绝对量的一半（即 25px），距离它开始的地方更远。
jsfiddle中它是-20px的原因是因为图像边距已经是5px。
于 2013-07-14T14:50:39.073 回答
2
假设您的页面宽度为 700 像素。而您的图像宽度为 100 像素（例如）。页面的中点为 350 像素，图像的中点为 50 像素。现在有你的右边距，这样你的形象就会在中间？？计算
- *页面宽度：350 * *在中间*
- * imagewidth 50 * *中间*
- 这 50 像素在边距的两侧都算在内
- 因为您的页面有 350 像素，而图像有 25 像素。减去 pagewidth-imageWidth 即**350-25 将是您的边距
我的回答看起来很笨重，对不起。它看起来很简单，但很棘手。
**
于 2013-07-14T15:12:20.723 回答
1
悬停时，图像将向左扩展 25px（边距从 +5px 变为 -20px），向右扩展 25px（因为图像大小：100px 新图像大小 - 50px 旧图像大小 - 25px 左边距）。由于图像已向左右均匀扩展，因此它看起来会居中。
另一方面，如果您放置 -50px，那么它将向左扩展 55px，向右扩展 -5px，因此看起来它已向左移动 - 这不是请求的行为。
于 2013-07-14T14:27:53.747 回答