仅仅通过它的某个部分使图像响应？

Question

所以，假设我有一个这样的图像：http://s9.postimg.org/fr6oy6eb3/img.jpg

如果我按照图像的高度设置图像的响应，则图像在每个屏幕分辨率中保持这样：http://s9.postimg.org/4hdz3899r/how_it_is.jpg

购买让我们说我想让图像仅在图像的红色区域内以高度响应，如下所示：http://s9.postimg.org/eq6g91xbj/how_i_want.jpg

我怎样才能实现这一目标？

Answer 1

您可以使用两张图片。您无法缩小图像的各个部分，即JPG，PNG，GIF。

对于需要一些JavaScript的<canvas>元素，这可能是可行的。那个比我更有经验的人必须证实这一点。

Answer 2

您需要将其拆分为2张图片。然后，您可以设置要缩放的部分的尺寸（黑色部分）。然后，您可以将红色宽度设置为固定像素值，但将高度设为百分比。

Answer 3

您需要使用两个单独的图像，还是只使用您在示例中显示的纯色背景？你可以简单地使用百分比。