Javascript 引导4页边距代码mt自动不工作

我想做一个粘性的页脚，但是mt auto根本不起作用。我尝试了很多方法来解决它，但都没有奏效。其他边距填充代码（如mt-1MB-2）也不起作用

HTML: CSS:

*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
垫底：20px；
背景色：#24252A；
字体系列：“无衬线工作”，无衬线；
颜色：#f7f7f7；
}
navbar先生{
过渡：所有。5s轻松；
}
.导航栏倒塌{
过渡：所有。5s轻松；
}
/*选项部分*/
.选项{
保证金上限：10雷姆；
边缘底部：2rem；
颜色：#f7f7f7；
显示器：flex；
证明内容：之间的空间；
}
.圆形包装{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
}
.圆圈{
宽度：250px；
高度：250px；
背景色：#f7f7f7；
边界半径：50%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.圈出文本{
页边顶部：1rem；
字体大小：1.5rem；
字母间距：2px；
}
.ss{
页边顶部：自动；
}
.圆圈img{
宽度：150px；
}

埃米尔










歌曲
影视
我的帖子
内容
内容

如果有帮助，请告诉我

*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
垫底：20px；
背景色：#24252A；
字体系列：“无衬线工作”，无衬线；
颜色：#f7f7f7；
}
navbar先生{
过渡：所有。5s轻松；
}
.导航栏倒塌{
过渡：所有。5s轻松；
}
/*选项部分*/
.选项{
保证金上限：10雷姆；
边缘底部：2rem；
颜色：#f7f7f7；
显示器：flex；
证明内容：之间的空间；
}
.圆形包装{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
}
.圆圈{
宽度：250px；
高度：250px；
背景色：#f7f7f7；
边界半径：50%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.圈出文本{
页边顶部：1rem；
字体大小：1.5rem；
字母间距：2px；
}
.ss{
页边顶部：自动；
}
.圆圈img{
宽度：150px；
}
.货柜码头{
位置：固定；
底部：0；
宽度：100%；
高度：60px；/*在此设置页脚的固定高度*/
行高：60px；/*文本垂直居中*/
背景色：#F5；
}

埃米尔










歌曲
影视
我的帖子
内容
内容

在css和HTML中添加以下类

---

在body

d-flex行中添加此类

 <footer class="container mt-auto">
    <div>content</div>
    <div>content</div>
</footer>


内容
内容

试试这个
在这里，您可以使用粘性页脚：

/*已添加*/
html，正文{
身高：100%；
}
身体{
显示器：flex；
弯曲方向：立柱；
}
body>section.container{
弹性：10自动；
}
正文>页脚{
弹性收缩：0；
}

得到更多

演示-1


*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
垫底：20px；
背景色：#24252A；
字体系列：“无衬线工作”，无衬线；
颜色：#f7f7f7；
}
navbar先生{
过渡：所有。5s轻松；
}
.导航栏倒塌{
过渡：所有。5s轻松；
}
/*选项部分*/
.选项{
保证金上限：10雷姆；
边缘底部：2rem；
颜色：#f7f7f7；
显示器：flex；
证明内容：之间的空间；
}
.圆形包装{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
}
.圆圈{
宽度：250px；
高度：250px；
背景色：#f7f7f7；
边界半径：50%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.圈出文本{
页边顶部：1rem；
字体大小：1.5rem；
字母间距：2px；
}
.ss{
页边顶部：自动；
}
.圆圈img{
宽度：150px；
}
/*增加*/
html，正文{
身高：100%；
}
身体{
显示器：flex；
弯曲方向：立柱；
}
body>section.container{
弹性：10自动；
}
正文>页脚{
弹性收缩：0；
}

埃米尔










歌曲
影视
我的帖子
内容
内容
现在应该可以了。是的，但他说他希望页脚有粘性，而不是固定的粘性和固定的粘性
 <footer class="container mt-auto">
    <div>content</div>
    <div>content</div>
</footer>