在 CSS3 中，使用 `transparency` 和 `gradient` 不起作用？ [关闭]答案

【问题标题】：In CSS3, using `transparency` with `gradient` doesn't work? [closed]在 CSS3 中，使用 `transparency` 和 `gradient` 不起作用？ [关闭]
【发布时间】：2015-06-17 06:00:03
【问题描述】：

这里是 jsfiddle：

http://jsfiddle.net/txj54fL9/

下面粘贴的代码：

.cover {
    background: linear-gradient(to bottom, rgb(0,0,255,0.5), rgb(238,130,238,0.5));
    background: -webkit-linear-gradient(top, rgb(0,0,255,0.5), rgb(238,130,238,0.5));

    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    position: absolute;
}

<h2> I'm bottom</h2>
<div class="cover"></div>

从演示中可以看出，封面根本不显示。如果我将rgb(0,0,255,0.5) 更改为rgb(0,0,255)，封面可以显示，但它会失去透明度..

有没有人知道如何保持透明度和渐变？

【问题讨论】：

标签： html css transparency gradient

【解决方案1】：

改用RGBA

.cover {
    background: linear-gradient(to bottom, rgba(0,0,255,0.5), rgba(238,130,238,0.5));
    background: -webkit-linear-gradient(top, rgba(0,0,255,0.5), rgba(238,130,238,0.5));

    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    position: absolute;
}

http://jsfiddle.net/txj54fL9/1/

【讨论】：

【解决方案2】：

Pikamander2 的答案是解决方案，请记住，您仍然可以将opacity:0.5; 用于任何元素。

看看here

【讨论】：