来自我的 phone 的 Safari 浏览器无法使用背景图片

Question

我上传了我的简单网站，但是当我使用 safari 浏览器从我的 phone 检查时，我看不到顶部的背景图片，我尝试了 this and 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

来自post：

勾选this comment by @PaulIrish:

Fixed-backgrounds have huge repaint cost and decimate scrolling performance, which is, I believe, why it was disabled.

来自我的 phone 的 Safari 浏览器无法使用背景图片

Background image not working with Safari browser from my phone

html

css

safari