在此网页中，Android Chrome 中的背景封面已损坏（仅？）答案

【问题标题】：background-cover is broken in Android Chrome, in this web page (only?)在此网页中，Android Chrome 中的背景封面已损坏（仅？）
【发布时间】：2020-04-08 06:31:07
【问题描述】：

虽然我有 background-cover 的 css 规则在 Chrome for Android 中运行良好，但不知何故，相同的规则在这个特定网站中失败了

奇怪的是，如果我在开发工具上粘贴相同的 background-image: url(backgrounds/landing-two.jpg); 规则，它就不起作用，但如果我取消选中它（保留原来的那个），那么我可以看到原来的规则有效

网站是https://kuworking-theme-landing-two.netlify.com/

会发生什么？

    background-blend-mode: var(--theme-ui-colors-backgroundimg__mode,unset);
    transition: all 0.5s ease 0s;
    background-size: cover;
    display: grid;
    -webkit-box-align: center;
    align-items: center;
    justify-items: center;
    height: 100%;
    width: 100%;
    background-image: url(backgrounds/landing-two.jpg);
    background-position: center center;
    transition: opacity 0.5s ease-in 0s;
    background-repeat: no-repeat;

【问题讨论】：

标签： javascript android css google-chrome background-image

【解决方案1】：

已通过删除 transition: all 0.5s ease; 规则（这是在 styled-components 上下文中设置的）神秘地解决了这个问题

【讨论】：