如何在HTML 5中裁剪图像？

Question

我正在开发一个响应式网站，其中背景是第一张图片中显示的大图片。

如果我自动减小浏览器的宽度，左右边缘应该像第二张图像中所示进行修剪。中心是重点。

怎么做？

Answer 1

@AngelGuy，

使用以下css：

background-image:url('bigImg.jpg');
background-size:cover; 
background-repeat:no-repeat;

对于固定高度的特定屏幕尺寸，调整浏览器宽度不会调整图像大小，图像边缘将会修剪。