Safari中未显示背景线性渐变

问题描述 投票:-1回答:1

我正在开发一个网站,但在使用Safari时遇到了麻烦。我使用的background-image: -webkit-linear-gradient在Chrome,Firefox等上运行完美,但是在Safari上,输出却有所不同。它仅显示在屏幕的一半。

我在身体上使用此样式:

body {
    background-image: -webkit-linear-gradient(-40deg, #000,#333 50%, #f9f9f9 50%);
    background-size: auto 1200px;
    -webkit-background-size: auto 1200px;
    background-repeat: no-repeat;
    background-attachment: scroll;
    top: 0;
    left: 0;
}

我已经尝试寻找解决方案,但到目前为止似乎没有任何效果。我已经测试过更改背景大小以覆盖它,但是它没有给出我想要的输出,以及设置top: 0;left: 0;,如关于stackoverflow的其他问题所示,但这也没有用。

我正在谈论的指向特定页面的链接是此页面:https://dashiofficial.com/product/test-product-01

有人知道该问题的解决方案吗?预先感谢。

css wordpress woocommerce
1个回答
0
投票

我已经检查了您的网站,并能够解决您的野生动物园问题。它与您为body{}定义的渐变无关,但与.single-product{}]的背景大小无关

尝试更改

.single-product {
    background-size: auto 1060px;
}

to

.single-product {
    background-size: 100% 1060px;
}

[它在Chrome和Safari中适用于我(未经Edge或Firefox测试)。

© www.soinside.com 2019 - 2024. All rights reserved.