html页面边缘背景怎么添加,html – 边缘的CSS背景颜色

我有一个透明的.png图像,我用css更改背景颜色,所以我可以使用不同颜色的相同图像.

这是一个虚拟图像,问题出在Chrome浏览器上,当你放大某些点并在某些类似的智能手机上时,我会在该图像的顶部和底部找到一条线：

这取决于我认为的页面分辨率.

Firefox无论如何都无法重现此问题.

有没有人见过这样的东西？怎么解决这个问题？

以下是一个示例,尝试使用Chrome放大或使用智能手机打开它：

.vertical-center {

position: relative;

top: 50%;

transform: translateY(-50%);

background-color: black;

background-clip: padding-box;

background-clip: content-box;

}

/* CSS used here will be applied after bootstrap.css */ .equal-col-height { display: flex; display: -webkit-flex; flex-wrap: wrap; }

Heading

更新

整个问题实际上是看到元素边缘的背景颜色,就像这里Fiddle link你可以通过打开智能手机上的链接并尝试放大来重现它.背景颜色来自边缘.

Kosh的解决方案解决了这个问题