动态调整 Squarespace 中图库块容器的大小,以便所有图像无论方向如何都具有相同的大小

问题描述 投票:0回答:1

所以我的目标是让我的所有图像显示为相同的尺寸,即,如果水平图像是1300x1000px,那么图库中的垂直图像应该是1000x1300px。 现在,画廊容器具有基于最宽图像宽度和图像高度的静态尺寸,它似乎没有包含最高图像高度。 这会导致画廊中水平图像大于垂直图像,即水平图像为 1300x1000 像素,垂直图像为 800x1000 像素。

我尝试了很多不同的 CSS 方法,感觉我确实处于需要 Javascript 才能从画廊容器实现此行为的地方。

感谢您的帮助!

javascript css gallery squarespace
1个回答
0
投票

在图像库项目上需要设置背景大小属性。

background-image: url(https://images.squarespace-cdn.com/content/v1/5f5f09509b510014eef53096/0a27ec38-eddc-4c0e-bd69-4f9ecfe9475d/SaltFlats+%282%29.jpg);
background-position: center;
background-size: cover;

此更改后,所有图像都将是容器的大小。

https://ibb.co/9885Vpc

© www.soinside.com 2019 - 2024. All rights reserved.