背景图像不适用于我手机上的 Safari 浏览器

Question

我上传了我的简单网站，但是当我使用 safari 浏览器从手机查看时，我看不到顶部的背景图片，我尝试了 this 和 this，但两者都不起作用。

  .header {
    padding: 10%;
    text-align: center;
    background: url("4.jpg"); 
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    
    height: 82vh;
    color: #FFFFFF;
    font-size: 2em;
    display: flex;
    align-items: center;
    flex-flow: column;
    gap: 1em;

    
  }

<header class="header">
        <h1>name surname</h1>
        <p>Front End Web Developer</p>
        <div class="arrow"><a href="#row"></a></div>
    </header>

这里是My website。 谢谢

Answer 1

已在移动浏览器中禁用背景附件。

将background-attachment 更改为background-size: cover。

更多信息：

How to replicate background-attachment fixed on iOS

来自帖子：

查看this comment by @PaulIrish:

固定背景具有巨大的重绘成本和大量滚动 性能，我相信这就是它被禁用的原因。