所以我开发了一个基本网站并使用了一些具有炫酷灯光效果的图像，但是颜色的变化触及了页面的边缘，这是图像:
所以你可以看到图像中的光到达边缘，所以我想知道的是，有没有办法在 css 或 html 中混合边缘，使它们看起来不错而不是那样？我浏览了整个网络，找不到任何与我的问题真正相关的内容......
提前致谢!
最佳答案
有很多方法可以做到这一点，但唯一好的方法是在制作图像时注意边缘。清晰简单。如果您的页面有黑色背景，请确保您有相同颜色的图像背景。然后使用您最喜欢的图像处理程序将您的“灯光效果”淡化为相同的颜色，然后击中边缘。
我建议不要生成具有透明背景的图像 - 您的图像很大并且性能会受到轻微影响。
如果您真的想尝试淡入淡出的后期制作，您可以使用 CSS 渐变使图像看起来像是在边缘淡出。或使用(特定于供应商的)CSS3 玩具，如 box-shadow(请参阅 Box shadow on MDN)来生成嵌入的黑色阴影。
请记住，尽管所有这些技巧，特别是在您展示的如此巨大的图像上，都会以浏览器性能(以及用户体验)为代价，并且没有得到广泛支持(特别是旧浏览器)。此外，许多移动设备不会感谢您的效果展示。
关于html - CSS - 将图像的边缘与背景图像混合，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25355376/