常用功能代码笔记

css

uni-页面固定底部button区

效果

代码

<viewclass="bottomBtnBoxBlock"></view><viewclass="bottomBtnBox"><view>查看图片</view></view>

// App.vue .bottomBtnBox{position:fixed;left:0;bottom:0;width:100%;display:flex;align-items:center;justify-content:flex-end;z-index:9;background:#fff;box-shadow:0 0 30rpx 0 #e4e7ed;padding:24rpx 0;padding-bottom:unquote('max(24rpx, env(safe-area-inset-bottom))');>view{text-align:center;background:#19be6b;color:#fff;height:80rpx;border-radius:80rpx;line-height:80rpx;padding:0 40rpx;margin-right:24rpx;}}.bottomBtnBoxBlock{box-sizing:content-box;width:100%;height:80rpx;padding:24rpx 0;padding-bottom:unquote('max(24rpx, env(safe-area-inset-bottom))');}