css作物和中心圖像

Question

我有多個圖像，其大小爲2000像素2000像素。我想把它們放到500px×500px的正方形中。而且我想裁剪圖像，以便在每個邊框處大約10％的圖像不可見。 （就像在中心拍80％80％的照片一樣）

我該怎麼做？下面的解決方案會過度裁剪圖像。

background-position：center center;

How to automatically crop and center an image

Answer 1

試試這個

<div > 
<img src="" ></img> 

</div> 

CSS

div{ 

    position:absolute 
    Height:500px; 
    width:400px; 

    } 

img{ 
    position:relative; 
    Height:300px;//give some width n height to image 
    width:200px; 
    margin:10px;  
    }