记Vue中即时页面填充内容不够,底部栏也可在浏览器最底端显示方法

在写项目的时候遇到这样一个问题,自定义的底部栏footer组件,当页面主内容不多时,底部栏不会在浏览器的低端,而是随页面到了中间甚至更靠上的位置。如图:


记Vue中即时页面填充内容不够,底部栏也可在浏览器最底端显示方法_第1张图片
例图

如何解决哩:

一般网页布局采用的是圣杯布局就是 头/身/脚的模式,采用flex布局即可解决

在引入footer组件的地方








在footer.vue中






这样就可实现底部栏就算没有填充内容,也在浏览器的底部显示,有填充的话自动向下延申

你可能感兴趣的:(记Vue中即时页面填充内容不够,底部栏也可在浏览器最底端显示方法)