html - 裁剪图片而不是随页面调整大小

Question

我的网站上有一张图片，我想始终保持相同的分辨率，即，当我调整页面大小时，我希望图片在支架内部向中间“特写”，而不是随着它。我想我只是错过了正确的 css 属性，每一个帮助都会得到帮助:

<ul class="slides">
<li style="width: 100%; float: left; margin-right: -100%; display: list-item;"><img width="2560" height="495" src="images/5.jpg"></li>
    <li style="width: 100%; float: left; margin-right: -100%; display: list-item;"><img width="2560" height="495" src="images/4.jpg"></li>
<li style="width: 100%; float: left; margin-right: -100%; display: list-item;"><img width="2560" height="495" src="images/3.jpg"></li>

</ul>

存在 -100% 利润率的原因是因为它们位于 slider 中。我认为它与我遇到的问题无关。谢谢。

Answer 1

您可以使用 CSS3 中的 clip 属性 - Link

另请查看 jcrop它是一个基于 jquery 的图像裁剪工具

希望对你有帮助