android Dolphin 9.0.1 上的 CSS 渐变渲染答案

【问题标题】：CSS gradient rendering on android Dolphin 9.0.1android Dolphin 9.0.1 上的 CSS 渐变渲染
【发布时间】：2012-11-22 04:29:21
【问题描述】：

渐变属性在我的 android 海豚浏览器版本 9.0.1 上无法正常工作。这是css：

position: absolute;
    top: 0;
    left: 0;
    width: 320px;
    height: 60px;

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(left, rgba(255,255,255,0) 66px, #171000 172px);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(17, 10, 0, 0)), color-stop(1, #171000));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(left,  rgba(17, 10, 0, 0) 66px, #171000 172px);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to right, rgba(17, 10, 0, 0) 66px, #171000 172px);

我是否必须为此浏览器添加另一条规则？据我所知，它使用 webkit，我不明白为什么它不起作用。

【问题讨论】：

标签： css android-browser dolphin-browser

【解决方案1】：

任一

将color-stop(0, rgba(17, 10, 0, 0)), color-stop(1, #171000) 更改为

background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #a7cfdf), color-stop(100%, #23538a));

或（如果上述解决方案没有帮助，那么您可以尝试一下）

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#8C8C8C));
background: -webkit-linear-gradient(bottom, #8C8C8C,#FFFFFF );

【讨论】：

【解决方案2】：

可能是由混合颜色格式（rgba 和 hex）引起的。
尝试使用：

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(17, 10, 0, 0)), color-stop(100%, rgba(23, 16, 0, 1)));

或

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(17, 10, 0, 0)), color-stop(100%, rgba(17, 10, 0, 1)));

考虑到 rgb(17, 10, 0) 与 #171000 不同

【讨论】：

谢谢你的回答，但我不能再测试这个了，因为那个项目已经死了:)（这个问题是 9 个月前问的）也许它会帮助别人
我试过了，不幸的是它对我不起作用。我尝试了 hsl()、rgb() 和 #xxxxxx，它似乎根本不喜欢任何渐变。不过，它似乎确实支持纯背景颜色的所有三种颜色语法。