如何使背景图像显示在cetered html页面的两侧？

我需要知道如何使图像显示在页面中心的HTML内容的两侧。例如，作为背景的公司徽标，但是HTML内容在中间，标志正在跨越背景并从中间分割，并显示在HTML内容的任何一侧。举一个更好的例子，unicorn in stack over flow的Y2K事件是如何出现在页面两侧的。

将图像与

多个背景一起使用两次，并使用
和
计算
来定位它们。在该示例中，有两个不同的位置（窗口边缘和内容div边缘）：


body{
背景：url(https://i.imgur.com/UFoVTPB.jpg)，网址(https://i.imgur.com/UFoVTPB.jpg)，网址(https://i.imgur.com/UFoVTPB.jpg)，网址(https://i.imgur.com/UFoVTPB.jpg); 
背景尺寸：50px，50px，50px，50px；
背景位置：-25px 10px，calc（100%+25px）10px，calc（50%-100px）150px，calc（50%+100px）150px；
/* 
将“i”视为图像宽度，“c”视为容器外部宽度（根据定义的盒子尺寸考虑填充物和边框）：
html左侧的半幅图像->计算（0-[i/2]）
html右侧的半幅图像->计算（100%+[i/2]）
内容左侧的半幅图像->计算（[50%-{c/2}]）
内容右侧的半幅图像->计算（[50%+{c/2}]）
*/
背景重复：无重复；
填充：0；
保证金：0；
}
div{宽度：200px；高度：200px；背景：eee；填充：10px；框大小：边框框；边距：自动；}
内容