简单的方法来自动移动图像在css

Question

我的目标是拍摄一个图像（大小变化），并使其适合一个容器（330x330像素）。我不想调整图像大小。我只想让CSS自动将它自动移动到图片上，就好像它是用330x330裁剪一样。

如果我放入一张小于330x330的图片，那么我认为它将不得不扩大。例如，如果它是200x800，那么它会拉伸出来，然后垂直移动图像以显示中心？

这是可能的，或者是我想要做的事情，没有很多烦人的PHP不可能？由于

Answer 1

您可以使用：

​div { 
    width: 330px; 
    height: 330px; 
    background: url("http://placekitten.com/800/200") 50% 50% no-repeat; 
    background-size: cover; 
}​ 

它应该在作品：IE9 +，Firefox 4以上，歌剧，铬，和Safari 5+。