在局部容器使用 overscroll-behavior 属性:
语法:

overscroll-behavior: [ contain | none | auto ]{1,2}


/* 单个关键字值 */
overscroll-behavior: auto;     /* 默认值 */
overscroll-behavior: contain;
overscroll-behavior: none;

/* 两个值,分别表示x方向和y方向 */
overscroll-behavior: auto contain;

兼容性
目前Safari浏览器尚不支持,Chrome和Firefox浏览器均支持,IE浏览器则有近似效果属性-ms-scroll-chaining代替,不过需要window 8及其以上版本的系统:
https://caniuse.com/#search=overscroll-behavior

例子:

.child-div{
    overscroll-behavior: contain;
    -ms-scroll-chaining: contain; 
}

标签: css

添加新评论