Html 如何在带有方向柱的flex中的末端定位单个组件？

我想将页脚元素定位在页面的末尾

{body is display:flex；flex direction:column；}

但是当我在

footer

中添加

justify self:flex end

时，它不能像flex direction是row时那样正常工作

我怎么做

*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
最小高度：100vh；
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
弯曲方向：立柱；
调整内容：灵活启动；
背景：#ff0；
}
标题{
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
宽度：100%；
证明项目：中心；
对齐项目：居中；
证明内容：中心；
高度：适合的内容；
填充：0.5rem 0；
}
标题span.logo{
字体大小：1.75rem；
字号：500；
}
标题svg{
位置：绝对位置；
右：5%；
}
页脚{
文本对齐：居中；
填充：0.5rem 0；
字体大小：14px；
}

解码
.........
版权及副本；2020解码

添加

flex: 1 1 auto;

你的导航应该能解决这个问题

nav {
  flex: 1 1 auto;
}

---

你们想这样吗…我在页脚添加了位置：绝对

*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
最小高度：100vh；
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
弯曲方向：立柱；
调整内容：灵活启动；
背景：#ff0；
位置：相对位置；
}
标题{
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
宽度：100%；
证明内容：中心；
对齐项目：居中；
证明内容：中心；
高度：适合的内容；
填充：0.5rem 0；
}
标题span.logo{
字体大小：1.75rem；
字号：500；
}
标题svg{
位置：绝对位置；
右：5%；
}
页脚{
位置：绝对位置；
底部：0；
宽度：100%；
文本对齐：居中；
填充：0.5rem 0；
字体大小：14px；
}

解码
.........
版权及副本；2020解码

您可以在页脚边距上使用top:auto，也可以在页脚之前的div上添加flex:1，就像这里的nav一样

*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
最小高度：100vh；
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
弯曲方向：立柱；
调整内容：灵活启动；
背景：#ff0；
}
标题{
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
宽度：100%；
证明项目：中心；
对齐项目：居中；
证明内容：中心；
高度：适合的内容；
填充：0.5rem 0；
}
标题span.logo{
字体大小：1.75rem；
字号：500；
}
标题svg{
位置：绝对位置；
右：5%；
}
页脚{
页边顶部：自动；
文本对齐：居中；
填充：0.5rem 0；
字体大小：14px；
}

解码
.........
版权及副本；2020解码

我希望我正确理解了这个问题

选项1：如果您有一个DIV元素作为内容-您可以设置最小高度

选项2：在元素之后添加

nav:：

选项3：添加
位置：绝对；底部：0px在元素
页脚上

选项4：添加
flex:auto在
页脚之前的最后一个元素上

选项1


*{
保证金：0；
填充：0；
框大小：边框框；
}
身体{
最小高度：100vh；
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
弯曲方向：立柱；
调整内容：灵活启动；
背景：#ccc；
}
标题{
显示：-网络工具包盒；
显示：-ms flexbox；
显示器：flex；
宽度：100%；
证明项目：中心；
对齐项目：居中；
证明内容：中心；
高度：适合的内容；
填充：0.5rem 0；
}
标题span.logo{
字体大小：1.75rem；
字号：500；
}
标题svg{
位置：绝对位置；
右：5%；
}
.内容{
最小高度：90vh；
}
页脚{
文本对齐：居中；
填充：0.5rem 0；
字体大小：14px；
}

解码
.........
我的同僚们都是精英。我们的责任必须是自然的！劳工部、eos autem、modi和dolor劳工部应向临时劳工局提交报告。
版权及副本；2020解码