我有一個模板，想按常規做一個div裡面放置一個img圖片，並且讓圖片鋪滿容器，自適應容器大小。HTML結構程式碼如下（在這個盒模型上，我已經放置了一些不重要的樣式）。

<div style="height:270px;width:400px;border:2px black solid;">
    <a href="http://www.paipk.com"><img src="..." alt="拍拍看科技"></a>
</div>

現在我初步想了兩個方案，但都不是太完善的，想請高手幫忙參考下：

object-fit解決方法：

直接給img套用一個object-fit:cover;讓img填滿盒模型。

div img{
    width: 100%;
    height: 100%;
    object-fit:cover;
}

這個方法很簡單也很實用，也符合理論上對盒模型和IMG容器的解釋。因為img本來也是一個容器，只不過它是公認的用來引導圖片的容器，用替換法把圖片替換成覆蓋的尺寸就是我要的效果。這個思路在理論上都是正確的。
但由於是新程式碼，在一些瀏覽器上還不相容。回退機制上，如果瀏覽器不認識object-fit，那整個圖片就會被強制拉伸成容器的尺寸。所以在回退機制上有待解決！

min方法:

這是我這兩天思考出來的，是通過對img元素垂直居中，並將它的高度和寬度設定一個最小滿屏值，這樣，也能讓圖片鋪滿容器：

div{
    position:relative;
    overflow:hidden;
}
div img{
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    min-width: 100%;
    min-height: 100%;
    transform:translate(-50%,-50%);
}

圖片高度或寬度任意一尺寸小於容器時，這個情況是正常的，但如果圖片的高度和寬度尺寸都大於容器，圖片也能鋪滿，但容器就只顯示大圖的中間部分。這就是這個方法的缺陷。