CSS 我如何在没有包装器的body上设置三个背景图像

Question

目标：

我需要创建一个具有三个背景图像的索引的解决方案。The first占据整个屏幕，the second占据屏幕的左半部分，the third占据屏幕的右半部分。

问题：

我尝试的一切都无济于事。

坦克。

Answer 1

您可以在一个元素上使用多个背景图像，并使用逗号分隔的行控制它们。

请参阅下面的示例。

有关多个背景的更多信息：

https://www.w3schools.com/css/css3_backgrounds.asp

https://www.w3schools.com/cssref/pr_background-image.asp

body {
background-image: 
url('https://placehold.it/100x100/09f/fff'),
url('https://placehold.it/200x200/0df/fff'), 
url('https://placehold.it/1200x1200/000/fff');
background-position: 
center left, 
center right,
center center;
background-size: 
auto, 
auto, 
cover;
background-repeat: 
no-repeat, 
no-repeat, 
no-repeat;

/* not related to this issue*/
height: 100vh;
}