如何更改 Squarespace 中照片和文本的顺序，使其在桌面上单向查看，但在移动设备上重新排序？我见过与此类似的问题，所以我尝试了自己的代码，但它没有改变任何东西。
我有索引页面可以平衡桌面上上方的布局(部分 1 = 左侧图像/右侧文本，第 2 节 = 左侧文本/右侧图像(
在移动设备上，流程是向后的(第 1 节 = 顶部的图像/底部的文本，第 2 节 = 顶部的文本/底部的图像(。
网页是： www.northcountryarmory.com/fort-knox
这确实是Squarespace网站上相当普遍的需求(并且已经存在多年(。不幸的是， Squarespace 目前不提供任何特定于移动设备的块布局选项。
此外，每个站点的布局都足够不同，这使得编写通用的CSS变得困难。这是逐案处理的。
在这种情况下，您可以定位特定页面(通过body元素上的集合 ID(，然后定位每个偶数索引页部分。请注意，以这种方式进行定位只会影响该网页，并且只会影响该网页上的索引部分。
通过 CSS 编辑器/自定义 CSS 插入以下 LESS CSS：
@media screen and (max-width: 640px) {
#collection-5db8b183ea3e1a49745ba89a .Index-page:nth-child(even) {
.sqs-row {
display: table;
}
.sqs-col-6:last-child {
display: table-header-group;
}
}
}
上面没有使用 flexbox，而是使用 CSS 表。在您的情况下，这需要更少的代码，并且将更广泛地兼容。不过，Flexbox是另一种方法。若要使用 flexbox，请将父元素设置为display:flex，然后在媒体查询的上下文中使用子元素上的orderCSS 属性，类似于上述内容。
对于可能阅读本文的其他人，您可能需要针对您的特定网站/上下文提出一个新问题(并确保提及您尝试过的代码(。
您可以通过两种方式使用 flexbox。Flexbox 可以让你颠倒顺序，如果这是你要找的(这是我对你写的内容的理解(。或者，您也可以使用 flex 顺序手动更改页面上特定元素的顺序。