Html CSS-页脚显示在错误位置

我试图在另一个div的底部和内部显示一个footer div，但是当我使用以下代码时，黑色的footer显示在div的顶部

<div class="Background">
<div id="sitefooter">
<style>
#sitefooter {
position: relative;
bottom: 0px;
height: 130px;
background-color: black;
width: 100vw;
}
</style>
</div>
</div>

我的背景CSS如下所示：

.Background {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100vw;
    height: 100vh;
    background-image: url('resources/background.png');
    background-size: cover;
    background-position: center;
}

如果有人能帮忙，那就太好了

---

谢谢

div.Background

必须有

位置：相对

样式，或者里面有

位置：绝对

的div将不起作用

.Background{
宽度：100%；
高度：200px；
背景：绿色；
位置：相对位置；
}
#网站页脚{
位置：绝对位置；
底部：0px；
高度：130像素；
背景色：黑色；
宽度：100%；
颜色：#fff；
}

这是外部div，
这是内部分区。

我已经为背景添加了相对位置，但现在它也这样做了，在顶部显示页脚……您是否将#sitefooter更改为position:absolute？对不起，我刚刚这样做了，我想它似乎已经解决了这个问题

.Background {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100vw;
    height: 100vh;
    background-image: url('resources/background.png');
    background-size: cover;
    background-position: center;
}