CSS - 图像缩放但从右边开始？

编程问答 2022-05-23

问题描述

article img {
    width: 100%;
    height: 350px;
    -o-object-fit: cover;
    object-fit: cover;
}
<article>
  <img src="https://i.ibb.co/84FnVcK/Group.png">
</article>

是否可以将图像上的“这需要可见”文本保留在那里？那么图像从不同的角度缩放？注意：这个需要可见的实际上是一些图片上的一个标志，当窗口变小（响应）时标志会掉下来

此处文字脱落

enter image description here

解决方法

试着给它object-position: left center，很像background-position，它决定了图片需要缩放时的锚点。

article img {
    width: 400px;
    height: 600px;
    -o-object-fit: cover;
    object-fit: cover;
    object-position: left center;
}
<article>
  <img src="https://i.ibb.co/84FnVcK/Group.png">
</article>

htmlimageimageimageimage-resizingresponsive