固定后，Safari 背景颜色过渡为透明。漏洞？

Question

我在 Safari 12.1 (14607.1.40.1.4) 中将背景颜色转换为透明时遇到问题。

代码不会将背景转换为透明。相反，它在悬停时会闪烁或什么都不做。

转换似乎在 Chrome 和 Firefox 中运行良好。如果

它也适用于 Safari

div为空
或 Position:fixed 已删除
或者目标背景颜色设置为一种颜色（尽管 rgba 透明度不起作用）

<!DOCTYPE html>
<html>
    <head>
        <style>
        body{
            background-color:white;
        }
        .box{
            width:200px;
            height:100px;
            background-color:lightblue;
            transition:1s all;
            position:fixed;
        }
        .box:hover{
            background-color:transparent;
        }
        </style>
    </head>
    <body>
        <div class="box">test</div>
    </body>
</html>

我希望能够将固定的 divs 背景颜色转换为透明。有没有办法让它发挥作用？

Answer 1

我刚刚遇到了同一个 Safari 错误，对此感到非常沮丧...

似乎 position: fixed 和 background: transparent 在 Safari 上不能很好地协同工作。

我最终在我的 "fixed" div 中添加了一个 div 并将其用于我的背景颜色转换。

固定后，Safari 背景颜色过渡为透明。漏洞？

Safari background-color transition to transparent when fixed. Bug?

css

safari

css-position

background-color

css-transitions