防止图片加载的过程中,页面抖动(改善用户体验)

让外层的盒子占位置,盒子的宽高比设置:

复制代码
// 防止图片加载的过程中,页面抖动
.wrapper 
    width: 100%
    height: 0
    overflow: hidden
    padding-botton: 100%

.wrapper (浏览器兼容问题)
    width: 100
    height: 100vh

padding-bottom: 高度与宽度的百分比


//通过设置
overflow: hidden
width: 100%
height: 0
padding-bottom: 高/宽 %

来自动撑开空白的图片
复制代码

 

posted @   haha-uu  阅读(531)  评论(0编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示