Javascript 如何将粒子js设置为背景？

我正在尝试设置与此类似的页面，这里的中心元素位于后面运行的动画前面：

我设置了这样的内容，它占据了自己的空间，与其他内容分开，而不是在后面：

我希望我的文字出现在粒子动画前面。你能帮个忙吗？我尝试使用z索引，但没有成功：

我的完整代码是，或者只是用最重要的位粘贴在下面

我在HTML中添加了以下内容：

 <!-- particles.js container -->
    <div id="particles-js"></div>
    <!-- particles.js lib - https://github.com/VincentGarreau/particles.js -->
    <script src="http://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"> 
    </script>

JS:

---

答案由ZohirSalak CeNa给出：

将画布设置为此位置：绝对；宽度：100%； 身高：100%；z指数：-1

我想向初学者澄清： 在HTML中，动画元素是 这个元素应该放在后台。注意id=element的值

在CSS中，我简单地添加了：

#particles-js {
    position : absolute;
    width:100%;
    height:100%;
    z-index:-1;
}

请注意，在与HTML文件中id=匹配的名称后面

现在看起来是这样的：

---

答案由ZohirSalak CeNa给出：

将画布设置为此位置：绝对；宽度：100%； 身高：100%；z指数：-1

我想向初学者澄清： 在HTML中，动画元素是 这个元素应该放在后台。注意id=element的值

在CSS中，我简单地添加了：

#particles-js {
    position : absolute;
    width:100%;
    height:100%;
    z-index:-1;
}

请注意，在与HTML文件中id=匹配的名称后面

现在看起来是这样的：

---

尝试将画布设置为以下位置：绝对；宽度：100%；身高：100%；z指数：-1；哇，谢谢你！这立刻就奏效了！看起来棒极了！非常感谢你！它对我有用，但particlejs交互性不能使用。请尝试将画布设置为以下位置：绝对；宽度：100%；身高：100%；z指数：-1；哇，谢谢你！这立刻就奏效了！看起来棒极了！非常感谢你！这对我很有用，但particlejs的交互性不能使用。

#particles-js {
    position : absolute;
    width:100%;
    height:100%;
    z-index:-1;
}