CSS3线性渐变不工作的机器人。 [英] CSS3 linear-gradient not working on android.

问题描述

在这里，但由于某种原因，我不能算出这个新手问题。我有以下的CSS它在我的iPhone，但不是我的Andr​​oid正常工作。从着眼于jQuery Mobile的演示了Android，我知道它可以处理背景渐变。谢谢

  .mydiv {
  背景：-moz-线性渐变（#FFFFFF，＃F1F1F1）重复滚动0 0 #EEEEEE;
  背景：-webkit-线性渐变（#FFFFFF，＃F1F1F1）重复滚动0 0 #EEEEEE;
  背景：线性渐变（#FFFFFF，＃F1F1F1）重复滚动0 0 #EEEEEE;
}
 

解决方案

Android浏览器4.0以下，根据 caniuse 使用旧 -webkit 语法：

的背景图像：-webkit梯度（直链的，50％0％，50％100％，显色停止（0％，＃a7cfdf），色停止（100％ ，＃23538a））;
 

奖励：我建议你使用的东西一样都不能少或北斗/上海社会科学院，它会为你节省所有这些工作 http://compass-style.org /

Newbie question here but for some reason I cant figure this out. I have the following CSS which works fine on my iPhone but not an my Android. From looking at the jQuery Mobile demos with the android I know it can handle background gradients. Thanks

.mydiv {
  background:    -moz-linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE;
  background: -webkit-linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE;
  background: linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE;
}

解决方案

Android browser below 4.0, according to caniuse uses the old -webkit syntax:

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

Bonus: I recommend you use something like LESS or Compass/SASS, it would save you all this work http://compass-style.org/

这篇关于CSS3线性渐变不工作的机器人。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！