如何避免滑块图像覆盖整个屏幕宽度和特定高度以拉伸或裁剪？

Question

我正在开发一个网站。有一个问题。如果不拉伸，滑块将不适合框架。

滑块图像是屏幕的全宽，我已经为它定义了高度。

在 CSS 部分我应用了 object-fit: cover 但这裁剪了我的图像

我希望你们能帮助我解决这个问题。我尝试了很多，也问了其他一些人，但他们无法帮助我。

或者我应该限制我的客户只使用该分辨率的图像吗？

Answer 1

是的，大多数情况下，您应该限制客户端使用不同的比率或分辨率，因为您使用的是全宽 aaaa 和定义的高度，定义的高度在您的情况下非常有限，您可以做的是使用

 object-fit:cover;
 object-fit:center;

但这不会停止裁剪，它只会在裁剪时专注于图像的中心。