1. 开发环境 vue
2. 电脑系统 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. 本期的分享到了这里就完结啦, 心愿对你有所帮忙, 让咱们一起致力走向巅峰。