是否可以相对于不同部分的中心或屏幕尺寸的中心定位图像？
我正在尝试放置一个横跨 3 个部分的大约 2.28:1 宽的 Logo ，以便它覆盖每个单独的部分背景而不是整个行背景。
此外，我希望(虽然不是绝对必要)每个部分和 Logo 的每个部分都是不同的颜色。我已经能够通过三个不同的背景和背景的三个不同位置(L 部分、L 对齐 Logo 等)来实现这一点。虽然这在全屏上看起来不错，但当屏幕较小时， Logo 的位置不正确。
我认为实现此目的的方法是将 L 和 R 图像相对于中心列的中心定位，或者相对于整个窗口的中心定位。如何做到这一点？
最佳答案
我能够通过以下左侧部分 Logo 代码实现所需的效果:
background-position: -webkit-calc(50% + 33vw) 60%;
background-position: calc(50% + 33vw) 60%;
以及右侧部分中 Logo 的以下代码:
background-position: -webkit-calc(50% + 33vw) 60%;
background-position: calc(50% + 33vw) 60%;
每个部分都使用位置相同的 Logo 图像，但每个部分的颜色不同。
关于相对于列宽或屏幕尺寸的 CSS 图像位置，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45579283/