[uniapp WeChat applet footer] If you are not satisfied with one screen, it will be fixed at the bottom, and if you exceed one screen, it will scroll with the page

<template>
	<view class="wrapper">
	    <view class="main">...</view>
	    <view  class="footer">xx智慧农场</view>
	</view >
</template>
<style>
	page {
      
      
		height: 100%;
	}
	.wrapper {
      
      
		height: 100%;
	}
	.main {
      
      
		min-height: 100%; 
		/* 与.footer的高度对应 */
		padding-bottom: 80rpx;
	}
	.footer {
      
      
		height: 80rpx;
		line-height: 60rpx;
		text-align: center;
		margin-top: -80rpx;
	}
</style>

insert image description here
insert image description here

Reference: https://www.jianshu.com/p/a8f72005e9c0

Guess you like

Origin blog.csdn.net/SingDanceRapBall/article/details/131276266
Recommended