CSS flex弹性布局来做 页面底部自适应：页面高度不足时，在底部显示；页面高度超出时，随页面滚动（亲测有效）

布局方式按照这个来 就可以了

<!-- 公共的父元素 --> <div class="index"> <div class="container"> <!-- 你的页面内容 --> </div> <div class="foot"> <!-- 需要自适应的底部内容 --> </div> </div>

.index{ /* 设置父元素为flex布局 */ display: flex; /* 设置子元素的排列方向 */ flex-direction: column; /* 设置子元素在该方向上的对齐方式 */ justify-content: space-between;  min-height: 100vh; 这里是重点 }