大多数混合模式在 chrome mobile 中不起作用 - 我已经能够让“屏幕”和“叠加”工作,但不是像乘法、变暗、排除等那样。有谁知道这是否与s9的gpu架构在这里不兼容?
这是一个带有屏幕截图的简单示例:
<style>
.blended-gradient{
background-blend-mode:exclusion, normal;
background:linear-gradient(black 0, white 50%, black 100%),
radial-gradient(black 0, white 70%, black 70.1%);
height:200px;
width:200px;
}
</style>
<div class="blended-gradient"></div>
在 chrome 桌面上,我看到一个漂亮的金属色球:
在 chrome android 中,我看到失败:
很想知道这是否是一个已知问题,或者是否有任何解决方法。请注意,我在纯 chrome 环境中,所以我目前不太关心其他浏览器。
更新 1
看来这可能是三星 s9 的问题,因为自 2019 年 4 月以来,其他人在 s9s 上偶尔看到此问题。我只在我的个人 s9 上进行了测试。请求站点的桌面版本可以解决问题,但这对最终用户没有帮助。CSS 背景混合模式不适用于三星 S9
更新 2
删除 meta name=viewport 标记可以解决问题,并且一切正常。这显然不是一个可行的解决方法,所以我希望 chrome 开发人员能看到这一点。将发布一个错误。