Question

我创建了一个网站，我在其中将白色背景颜色（#FFF）应用到我的面板（div）以添加一些透明效果。这在chrome＆amp; amp;火狐。但是在Safari中不起作用。我该怎么做才能在safari中创造相同的效果。

.panel{
    position:relative;
    background-color: #FFF;
    background:#FFF;
    bgcolor:#FFF;
    #safari { background-color:#FFF }
}

我尝试了所有版本的背景颜色（bgcolor，背景颜色等）＆amp;还试过黑客

#safari{
    background-color:#FFF
}

但没有效果。请帮忙。 Link标签也不仅仅在IE中工作，而是在其他浏览器中完美运行。

Answer 1

白色背景不会增加任何透明度。

您可以尝试以下操作，这应该适用于所有浏览器：

.my-class {
    background-color: rgb(255,255,255); // White background for old browsers
    background-color: rgba(255,255,255,0.5); // White background, 50% transparency for more modern browsers. Will be ignored by old browsers
}

Answer 2

试试这个：

   _::-webkit-full-page-media, _:future, :root .panel {
     background-color:#FFF
  }

编辑：这适用于safari 7.1+（在您的情况下，8.0）

Answer 3

This blog post建议这个CSS黑客攻击：

# @media screen and (-webkit-min-device-pixel-ratio:0) {
    #safari { background-color:#FFF }
}

背景颜色CSS不适用于Safari，但在Chrome，Firefox中运行良好

3 个答案: