Javascript 背景图像未显示（使用伪选择器）

为什么背景图像不显示？我尝试了谷歌的几乎所有方法，但什么都看不见。 请给我一个解决办法。 :(

代码如下

HTML

---

注意：检查图片是否可用。在公开使用之前检查许可证。我认为问题出在你的图片上，因为我尝试过使用另一张图片，它可以工作

.home {
    display:flex;
    width:100vw;
    height:100vh;
}
.home::before {
    content: '';
    display:block;
    background:url('https://unsplash.com/photos/O2o1hzDA7iE/download?force=true&w=1920');
    position:absolute;
    width:100vw;
    height:100vh;

    top:0;
    left:0;
}

---

下载图像并写入图像的url（“…”）路径，或者您需要直接指向图像的路径：

---

右键单击图像->查看图像

，因为背景的URL指向HTML页面，而不是图像？

.home {
    display:flex;
    width:100vw;
    height:100vh;
}

.home::before {
    content: '';
    display:block;
    background:url(https://pixabay.com/photos/workplace-team-business-meeting-1245776/);
    position:absolute;
    width:100vw;
    height:100vh;

    top:0;
    left:0;
}

.home::before {
    content: '';
    display:block;
    background:url(".home::before {
    content: '';
    display:block;
    background:url("https://cdn.pixabay.com/photo/2016/03/09/09/22/workplace-1245776_960_720.jpg");
    position:absolute;
    width:100vw;
    height:100vh;

    top:0;
    left:0;
});
    position:absolute;
    width:100vw;
    height:100vh;

    top:0;
    left:0;
}

.home {
    display:flex;
    width:100vw;
    height:100vh;
}
.home::before {
    content: '';
    display:block;
    background:url('https://unsplash.com/photos/O2o1hzDA7iE/download?force=true&w=1920');
    position:absolute;
    width:100vw;
    height:100vh;

    top:0;
    left:0;
}