0

次のCSSがSafariで背景画像を表示できない理由を知っている人はいますか? この CSS は、他のブラウザーで私の背景画像を表示することに注意してください。

.thGridColumnHeader
{
    background-image: url('../Images/Textures/glass.png');
    background-image: none,-webkit-linear-gradient(top,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-image: none,-moz-linear-gradient(top,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-image: none,-o-linear-gradient(top,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-image: none,linear-gradient(to bottom,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-position: 50% 50%;
    background-color: #1d1d1d;
}

他のブラウザでの出力は次のとおりです

ここに画像の説明を入力

これがサファリの出力です

ここに画像の説明を入力

4

2 に答える 2

3

CSSクラスで次の調整を行うことで、問題を解決しました。

.thGridColumnHeader
{
    background-image: none,-webkit-linear-gradient(top,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-image: none,-moz-linear-gradient(top,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-image: none,-o-linear-gradient(top,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-image: none,linear-gradient(to bottom,rgba(255,255,255,.12) 0,rgba(255,255,255,.08) 50%,rgba(255,255,255,.05) 51%,rgba(255,255,255,.0) 100%);
    background-position: 50% 50%;
    background-color: #1d1d1d;
    background-image: url('../Images/Textures/glass.png');
}

以下のコードを CSS クラスの最後の部分に移したところ、うまくいきました。

    background-image: url('../Images/Textures/glass.png');

サファリでの出力は次のとおりです。

ここに画像の説明を入力

于 2013-06-25T03:41:11.750 に答える