0

我的网站是（https://www.yahoonewsz.com），我已经在服务器的 public_html 文件夹中上传了一张图片。

我使用以下代码作为背景

#main {
  background-image: url("image908.jpg");
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

在 WordPress 的高级 CSS 部分。

为什么图片在手机上没有响应？

谢谢。

4

1 回答 1

0

您正在使用background-size: coverwhich根据background-size文档“在不拉伸图像的情况下尽可能大地缩放图像。如果图像的比例与元素不同，则会垂直或水平裁剪它，以便没有剩余空间。”

这意味着它正在缩放到最小的“非挤压”尺寸，它可以防止容器中的任何空白空间。由于您的网站（即#main）在移动设备上大致3000px很高，因此背景图像被缩放到大约 3000 像素高。

如果要将其限制为最大宽度，请使用background-size: contain“在不裁剪或拉伸图像的情况下尽可能大地缩放图像”。这意味着它将始终充满容器而不会被切断。请注意，这将根据您的background-position设置在图像下方（或上方）为您提供空白空间。

于 2018-07-06T03:06:06.173 回答