????????在pc端 我們可能隨意設置圖片的固定寬高，但是在移動端，固定寬高就是濟幾給濟幾刨坑，這時候，padding就起了很大的作用。在css中，padding的百分比都是相對于寬度計算的。由于移動端的屏幕寬度是各不相同的，有的是414，有的是375，還有的是360或者320的，圖片在不同的寬度下需要固定圖片的寬高比例而不是圖片的寬高大小。

????????有時候我們可以設置圖片為背景圖片，固定一個高度，然后background-size: cover，但是隨著寬度的變化 高度就不太合適了，￣□￣｜｜這時候，padding就起大作用了：padding: 63% 0 0;background: url("../../../static/img/13.jpg") no-repeat center; background-size: cover; 這樣使用padding百分比，圖片比例都是恒定不變的。如圖1。

圖1 背景圖效果

????????但是，有一些不方便用背景圖片的地方，比如我們用的圖片都是請求接口獲取的時候，這時候就該用到img標簽了，只要圖片外面有一個固定比例的盒子，同樣能達到不同寬度下相同比例的圖片。如圖2。

圖2 img效果圖

????????代碼如下圖3和圖4：

圖3 html部分

圖4 css部分