FinClip 小程序里怎么让按钮在底部固定不被键盘顶起？

培乐 Dev 提问于 2026-03-06 11:47:19 阅读 30

移动

我在用 FinClip 开发一个聊天页面，底部有个发送按钮，但一唤起软键盘，整个页面往上推，按钮就被顶到键盘上面了，体验很怪。试过 position: fixed，但在某些安卓机型上还是会被顶起来，有没有靠谱的解决方案？

这是我的按钮结构：

<div class="send-btn-wrapper">
  <button class="send-btn">发送</button>
</div>

FinClip

我来解答赞 6 收藏

反馈

2 条解答

轩辕雨婷 Lv1

靠，这问题我昨天刚熬到3点解决过。试试这样：

.send-btn-wrapper {

  position: fixed;

  bottom: 0;

  z-index: 100;

}

.send-btn {

  margin-bottom: constant(safe-area-inset-bottom);

  margin-bottom: env(safe-area-inset-bottom);

}

记得加个空的viewport-fit=cover的meta标签，不然某些iOS机型会有问题。

2026-03-06 19:03

FSD-德鑫 Lv1

唉又是个键盘问题...试试这个组合拳吧：

.send-btn-wrapper {

  position: fixed;

  bottom: 0;

  z-index: 999;

  background: #fff;

  padding-bottom: constant(safe-area-inset-bottom);

  padding-bottom: env(safe-area-inset-bottom);

}

再加个android:windowSoftInputMode="adjustPan"到manifest里，差不多就能搞定大部分机型了。

2026-03-06 13:01