php - 在css中自动移动图像的简单方法

Question

我的目标是拍摄一张图片（大小不一）并将其放入一组容器（330x330 像素）中。我不想调整图像大小。我只想让css自动移动以使图片像用330x330裁剪一样。

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

如果没有很多烦人的PHP，这是可能的还是我试图做的事情是不可能的？谢谢

score 1 · Accepted Answer

您可以使用：

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

它应该适用于：IE9+、Firefox 4+、Opera、Chrome 和 Safari 5+。

1 回答 1