純CSS實現自適應正方形

有時候我們需要實現這種自適應不同手機屏幕的等寬正方形，如圖： 剛開始自己很困惑，寬可以計算，那麼高怎麼隨着寬的變化而變化呢？ 後來查閱相關材料總結出兩種方法： 方案一：設置垂直方向的padding撐開容器 在 CSS 盒模型中，一個比較容易被忽略的就是 margin, padding 的百分比數值計算。按照規定，margin, padding 的百分比數值是相對 父元素寬度 的寬度計算的。由此可以

>>阅读原文<<