1、問題：

圖片在加載成功前，包裹圖片的div沒有被撐開，導致整體布局難看，產生頁面“閃爍”的現象。

2、解決：

設置容器的padding-top / padding-bottom為百分比 ，

當margin/padding取形式為百分比的值時，都是以父元素的width為參照。

#container {width: 50%; //父元素寬度的一半background-color: red; //僅為了方便演示 } .placeholder {padding-top: 50%; //與width: 50%;的值保持一致，也就是相當于父元素寬度的一半。 } <div id="container" class="placeholder"></div>

?

轉載于:https://www.cnblogs.com/cindy2035/p/10436879.html

總結

以上是生活随笔為你收集整理的【CSS】当图片加载缓慢时，图片如何自适应高度的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。