html - 具有透明度的渐变

Question

具有透明度的渐变！[在此处输入图像描述][1]

我想在底部应用透明的多色渐变，如下图所示。我找到了几页来解释这一点，但我仍然无法让它正常工作。

我试过这个小提琴http://jsfiddle.net/QEhsG/2/（在stackoverflow上找到）但我无法完美地获得黑白组合。

有什么帮助吗？

Answer 1

给alpha= 0你的第一个rgba。像这样写

button {
    background-color: black;
    background-image: -webkit-linear-gradient(top, rgba(252, 252, 252, 0) 0%, rgba(186, 186, 186, 1) 100%);
    background-image: -moz-linear-gradient(top, rgba(252, 252, 252, 0) 0%, rgba(186, 186, 186, 1) 100%);
    width: 200px;
    height: 100px;
}

检查这个http://jsfiddle.net/QEhsG/6/

更新

http://jsfiddle.net/QEhsG/8/