你好!

我在一个列中有一个图像,图像的大小在1440像素左右很好,但当浏览器的大小变小时,图像就会缩小。我们如何设置它,当浏览器小于1440像素时,图像不会缩小,而是保持相同的大小,图像过大的部分会消失在屏幕上。希望这有意义!

附件是图片。谢谢你!


这是我的网站只读:链接
如何共享您的网站只读链接)

嗨,雷米,

你是手动设置图像的分辨率,还是仍然设置为自动?我的理解是,最好的做法是将图像的宽度/高度设置为100%,然后使用父容器+图像填充选项来获得您想要的结果。

如果你能安排一个只读共享链接然后我们可以看看你的项目的细节,帮助你把这些分类脸红:

1像

谢谢,杰克!我知道我忘了什么东西:汗:这里是只读链接:Webflow——AllVoices

当你向下滚动屏幕时,你会看到截图中的图像,看到“与人交谈是艰难的。”AllVoices让它更简单。”

谢谢你!

没烦恼!

为了解决这个问题,选择你的图像,并设置高度/宽度为100%。然后设置一个图像填充选项(在这种情况下,“覆盖”可能是最好的)。这将使图像在所有分辨率/断点上保持完整的高度,图像是可见的,并阻止其收缩: raised_hands:: raised_hands:: raised_hands:

希望这能回答你的问题!

1像

那工作!非常感谢,Josh!

1像

没问题,雷米!很高兴能帮上忙:恩:

我也感谢你,因为我也有同样的问题,你的建议帮助!

1像

@drtr我似乎在图像缩小方面也有类似的问题。我将图像设置为100%宽/高,填充为“覆盖”。它在webflow的预览中看起来很好,但是当我看到发布的版本时,我的“真正的合作”部分的第一列中的图像在移动人像上似乎变小了。

你能给我指个方向吗?
https://preview.www.raktarban.com/preview/paradigm-02b5a5?utm_medium=preview_link&utm_source=designer&utm_content=paradigm-02b5a5&preview=a31b2ad0a537f98ad22df5f7736701a0&workflow=preview

提前谢谢!

嗨,瑞秋!当然,我很乐意帮忙。

这是一个非常有趣的问题。在看了只读链接后,看起来你所有的图片在真正的协作部分共享相同的类/样式,所以奇怪的是,“分享团队资产”的图片在发布的网站上更小思考:

这可能是由符号中一些奇怪的行为引起的,也可能是我在样式中遗漏了一些更深层次的东西。每当我遇到类似的情况时,我的第一个调用点是用一个新元素替换“损坏的”元素(通过复制一个工作元素然后覆盖内容)。所以我认为你最好的选择是尝试复制/粘贴一个工作的符号/图像(例如“重用组件”),然后使用符号覆盖替换图像。有时,使用一个新实例从头开始是最简单的选择: sweat_smile:

这是一个快速的屏幕记录步骤。(一定要记得在尝试之后再发布你的网站!):[屏幕记录]-范式复制+覆盖

让我知道这是如何重新发布后!如果这不能解决它,你能给我一个直接链接到已发布的页面,这样我就可以检查源代码更详细了?: male_detective: