对于移动网站加载一个图像和隐藏另一个，加载隐藏的图像和隐藏Squarespace移动图像

Question

在我squarespace网站（http://rmcclainmedia.com）我对索引页的第二图像。现在它是“客户logos.png”。这形象是不容易看到在移动平台上。因此，我想建立某种形式的代码，当有人从桌面程序访问，我要显示的图像是可见的，对于移动图像的显示被隐藏。而对于移动，我希望它是反过来的。据我所知，需要发生的过程，只是不知道写这个代码，并将其注入到我的squarespace页面的正确途径。

Answer 1

有许多的方法为从一般的角度来处理这Squarespace选项：

1. 使用CSS媒体查询简单地隐藏/显示基于浏览器的宽度的特定部分或块。
2. 使用CSS媒体查询隐藏/显示部分或块和相应的显示/隐藏在基于浏览器的宽度它的地方不同的部分或块。
3. 使用不同类型的块，诸如画廊或摘要块，而不是图像块，这将根据浏览器的宽度调节其自身的布局。

需要注意的是在下面的例子中使用的section标识假设你的第一个index section URL slug是“新页”，第二个被命名为“新页移动”。 Squarespace会产生从URL蛞蝓的ID。这是一个例子;你可能会有所不同。 CSS应通过the CSS Editor添加。还要注意的是，如果显示/隐藏块而不是部分，下面的代码将需要改变使用块ID，而不是部分的ID。

选项1是很简单的。在特定情况下，通过CSS编辑器插入以下CSS将完成它：

@media screen and (max-width:640px) {
  #new-page {
    display: none;
  }
}

选项2类似，当然，不同之处在于不是简单地隐藏章节中，您也将显示另一个。这是假设你已经创建了一个额外的索引页部分正下方有问题的第一个：

@media screen and (max-width:640.1px) {
  #new-page {
    display: none;
  }
}
@media screen and (min-width:640px) {
  #new-page-mobile {
    display: none;
  }
}

作为选项3，通过使用gallery block grid或summary block grid布局，并单独上传徽标，布局将自身管理在一定程度上，在窄的宽度堆叠徽标。

（题外话：我最初还以为你了“关于”页面，这是不理想的组成在移动设备上，因为你的问题，是关闭屏幕上谈论的图像如果你最终想要解决的是，后一个新的问题。）