css中IOS中position: fixed兼容性
1.开发环境 vue2.电脑系统 windows11专业版3.在开发的过程中,我们会遇到ios的一些兼容性的问题,下面我来分享一下position: fixed;在ios中的兼容性问题。4.废话不多说,直接上代码:
//解决思路:给元素设置position: fixed;
父元素添加position: absolute;
最外层的元素要设置position: relative;
// position: fixed; 元素
.g-index-hjqweb {
width: 100%;
height: 48px;
background-color: #b8d9d9;
z-index: 10;
position: fixed;
//position: absolute;
top: 0;
overflow:scroll;
}
// position: fixed; 父元素
.g-index-wrap {
width: 100%;
//height: 100%;
min-height: 100vh;
//overflow-x: hidden;
overflow: hidden;//关键代码
box-sizing: border-box;
-webkit-overflow-scrolling: touch;
display: flex;
justify-content: center;
position: absolute;
top: 0;
height: 670px;//注意:如果子元素都脱离了文档流,没有高度撑开父元素,需要添加高度,不然可能会有兼容性问题
}
5.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。
转载自:https://segmentfault.com/a/1190000041952034