Javascript 什么元素可以生成背景：url（）；不显示图像

我试图在我的网站的一个div中添加以下效果：

我已经完成了视频中的所有工作，但是

.container\u page\u 1.column.active.bg.bg1

2,3和4的背景图像即使使用完整路径也无法显示，jQuery也无法正常工作

我确信导致这些问题的原因是我在一个div中添加了教程中的代码，而不是直接在body中，而是在另一个div中

我将粘贴页面的所有代码，包括HTML和CSS，还将链接一个代码笔，因为我不知道代码的哪一部分是错误的

这是一个实时代码笔：

我已经把我的网站分成了3页。我在第一页添加了视差效果，并尝试将视频教程中的效果添加到第二页

我还有一个

reset.css

文件，它太大了，无法添加到这里。我在网上找到的。如果不使用

reset.css

，代码笔的顶部将有一个边距，通过该边距，您可以看到本应位于

.container\u page\u 1.column.active.bg.bg1

上的背景图像

你觉得怎么样

$（document）.on（'mouseover'，'container\u page\u 1.column'，function（）{
$（this.addClass（'active'）.sides（）.removeClass（'active'）；
})
//消除滚动条
var child=document.getElementById（'child-container'）；
child.style.right=child.clientWidth-child.offsetWidth+“px”
/**index.html-开始****/
正文，html{
身高：100%；
宽度：100%；
溢出：隐藏；
保证金：0；
填充：0；
边界：0；
}
#父容器{
身高：100%；
宽度：100%；
溢出：隐藏；
位置：相对位置；
}
#子容器{
位置：绝对位置；
顶部：0px；
底部：0px；
左：0px；
右：0px；/*精确值通过JavaScript给出*/
溢出：自动；
滚动捕捉类型：两者接近；
}
标题{
身高：100%；
背景图像：url（“https://i.postimg.cc/V671cpsf/ps4-controller-min.jpg");
背景附件：固定；
背景位置：底部中心；
背景重复：无重复；
背景尺寸：封面；
文本对齐：居中；
滚动捕捉对齐：居中；
}
收割台h1{
字体大小：32px；
字体大小：粗体；
位置：粘性；
最高：5%；
边缘底部：10px；
}
标题p{
位置：粘性；
宽度：450px；
文本对齐：居中；
保证金：自动；
边缘顶部：100px；
}
.容器第1页{
宽度：100%；
高度：100vh；
/*背景色：红色*/
滚动捕捉对齐：居中；
溢出：隐藏；
}
.container\u page\u 1.栏{
宽度：25%；
身高：100%；
浮动：左；
右边框：2倍实心rgba（0,0,0,0.5）；
框大小：边框框；
z指数：1；
}
.container\u page\u 1.列：最后一个子项{
边界权：无；
}
.container\u page\u 1.column.content{
位置：相对位置；
身高：100%；
}
.container\u page\u 1.column.content h1{
位置：绝对位置；
最高：50%；
转化：translateY（-50%）；
宽度：100%；
背景：rgba（0,0,0,1）；
文本对齐：居中；
保证金：0；
填充：0；
颜色：rgba（255、255、255、.2）；
字号：15em；
边框顶部：2倍实心rgba（0,0,0,0.5）；
边框底部：2倍实心rgba（0,0,0,0.5）；
}
.container\u page\u 1.column.content.box{
位置：绝对位置；
最高：50%；
转化：translateY（-50%）；
框大小：边框框；
填充：40px；
背景：rgba（255，255，255，1）；
文本对齐：居中；
过渡：0.5s；
不透明度：0；
}
.container\u page\u 1.column.active.content.box{
不透明度：1；
}
.container\u page\u 1.列.内容.框h2{
保证金：0；
填充：0；
字体大小：30px；
颜色：#262626；
}
.container\u page\u 1.column.content.box p{
颜色：#262626；
字号：18px；
}
.container\u第1页.column.bg{
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
身高：100%；
指针事件：无；
z指数：-1；
}
.container\u page\u 1.column.active.bg.bg1{
背景：url（'https://i.postimg.cc/ZRYZ24Ss/ac-odyssey-min.jpg');
背景尺寸：封面；
背景附件：固定；
背景位置：中心；
过渡：0.5s；
}
.container\u page\u 1.column.active.bg.bg2{
背景：url（'https://i.postimg.cc/x8h2XmbB/borderlands-3-min.jpg');
背景尺寸：封面；
背景附件：固定；
背景位置：中心；
过渡：0.5s；
}
.container\u page\u 1.column.active.bg.bg3{
背景：url（'https://i.postimg.cc/1RjPCkYM/god-of-war-4-min.jpg');
背景尺寸：封面；
背景附件：固定；
背景位置：中心；
过渡：0.5s；
}
.container\u page\u 1.column.active.bg.bg4{
背景：url（'https://i.postimg.cc/qqzrBwg8/sw-jedi-fallen-order-min.jpg');
背景尺寸：封面；
背景附件：固定；
背景位置：中心；
过渡：0.5s；
}
.容器第2页{
宽度：100%；
身高：100%；
背景颜色：绿色；
滚动捕捉对齐：居中；
}
/****index.html-结束****/

Lorem ipsum dolor，坐在amet Concertetur Adipising Elite的位子上。自由原则中的缺陷在于，它是一种不平等、不平等、不平等的生活实践

1.
什么是lorem ipsum
Lorem ipsum dolor，坐在amet Concertetur Adipising Elite的位子上。发明人必须在一个月内，在一个月内，在一个月内，在一个月内，在一个月内，在一个月内，在一个月内，在一个月内，在一个月内，在一个月内！

2.
什么是lorem ipsum
Lorem ipsum dolor，坐在amet Concertetur Adipising Elite的位子上。发明人的财产必须由其本人承担