最近一个项目  css要求非常严格 记录一下遇到的一个知识点吧


需求:所有页面的背景色都是统一的颜色,安卓的话是没什么问题的,但是ios上有一个页面上拉下拉的回弹效果 ,有就有吧,主要是这个回弹的背景色还不一样 ,一个灰色的主背景 下拉是一个白色的背景肯定是不行滴


解决办法2种

1.在page.json  里面找到对应的页面    直接在style里面加上一个 

"backgroundColorTop": "顶部窗口的背景色",

"backgroundColorBottom": "底部窗口的背景色"

这个是比较简单的   会加上背景色但是加的也不多   一直下拉的话还是能看到其他的背景色

(不过一般也没有人会一直下拉吧)

2.如果追求极致的完美 可以试试这个方法

正常情况下的话  如果的页面内容不多不会造成页面滑动的话  可以直接在pages.json里面加

"disableScroll": true

这行代码会直接把页面的滚动取消  一般的话不建议直接用这个方法 

不过我们可以给页面上加一个scroll-view 标签  

<scroll-view scroll-y="true" class="content" :enhanced="true"
         :bounces="false" :show-scrollbar="false">

       <!-- 主要是用 scroll-view 标签包裹住内容  -->
</scroll-view>

.content{
        //可视高度,需要在多大的盒子中进行滑动
        height: 100vh;
        width: 750rpx;
}

:如果页面有弹窗,最好写在scroll-view外边
用它直接包裹全部内容

这样下来可以完美禁止ios自带的橡皮筋回弹。内容少时,"disableScroll": true生效,内容多时,有第二步。

每日一个小总结,今天就这样了

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐