H5网站-微信浏览器中打开底部fixed遮住内容区域问题

其他安卓浏览器都没问题,在微信浏览器中会出现这种情况,是因为fixed兼容性问题造成,但是此时absolute并不能满足需求,故使用如下方式解决&

其他安卓浏览器都没问题,在微信浏览器中会出现这种情况,是因为fixed兼容性问题造成,但是此时absolute并不能满足需求,故使用如下方式解决:

<div>

<div class="content-box"></div>

<div class="nav-bottom"></div>

</div>

.nav-bottom {

  position: fixed;

  bottom: 0;

  left: 0;

  right: 0;

   height: 50px;

}

.content-box {

  /*main绝对定位,进行内部滚动*/

  position: absolute;

  /*top是头部的高度*/

  top: 0px;

  // /*bottom是底部的高度*/

  bottom: 50px;

  /*使之可以滚动*/

  overflow-y: scroll;

  /*增加弹性滚动,解决滚动不流畅的问题*/

  -webkit-overflow-scrolling: touch;

}

发布者:admin,转转请注明出处:http://www.yc00.com/web/1743813208a4511426.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信