body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
footer { position: fixed; bottom: 0; height: 72px; }

手机上滑到文章末尾,最后一行文字被固定页脚压住,怎么滑都露不出来,大约遮住 72 像素。这类现象通常不是突然出现的,往前翻半天日志能看到苗头。

追下去是这么回事:页脚用了 position:fixed 固定在底部,主体没有留出等高的下边距,内容就顶到页脚下面。安全区没算进去,刘海机型遮得更多。

「页脚 fixed 遮挡」改完先别急着全量,挑一台机器放半天,真有问题这段时间就能看出来。同一份配置存在多处的,先确认改的是被加载的那一份。

新版本先放一台机器上跑一天再全量,问题一般在这段时间暴露。备份不是备了就行,恢复一次才算数,很多备份文件打开才发现是空的。

接口问题先分清是没发出去、发出去了没收到,还是收到了处理失败。

处理上按这个顺序:给 body 加 padding-bottom,高度等于页脚高度加安全区;页脚高度用变量存,JS 和 CSS 读同一个值;在全面屏和老机型各滑到底,确认末行完整露出。

确认没问题再收工,滑到页面底部,最后一行文字完整显示在页脚上方。

作者 9823189