如何居中裁剪宽度较大的高清图像

时间:2014-12-11 15:58:41

标签: html css html5 image css3

我正在使用它来裁剪,但这对于更宽的图像不能正常工作,但对于那些高度更高的图像非常有效。

 border:1px solid black;
 background: url(http://www.hdwallpaper201.com/wp-content/uploads/2014/11/Rajnikanth-Sketch-HD-Photo.jpg) no-repeat scroll center center / 100% auto transparent;
 height: 200px;
 width: 200px;
 left: 717px;
 top: 646px;
 z-index: auto;

Fiddle Link

1 个答案:

答案 0 :(得分:1)

您可以使用background-size: cover

.bg {
 border:1px solid black;
 background: url(http://www.hdwallpaper201.com/wp-content/uploads/2014/11/Rajnikanth-Sketch-HD-Photo.jpg) no-repeat scroll center center / 100% auto transparent;
 background-size: cover;
 height: 200px;
 width: 200px;
 left: 717px;
 top: 646px;
 z-index: auto;
}
<div class="bg"></div>