Css 背景：透明不起作用

我尝试在我的任务中使用背景色透明（可以在图像中看到），但它没有用。背景透明不做任何事情，其显示李的背景色

我尝试了很多方法，但都不管用。我能做什么

提前谢谢

HTML:

<div>
   <ul>
      <li>...</li>
      <li>...</li>
      <li>...</li>
      <li>...</li>
      <li>...</li>
   </ul>

   <span class="left-arrow-winners"></span>
   <span class="right-arrow-winners" ></span>
<div>

---

可能是您没有在正确的html标记中设置透明度样式。 正如您所说，应用透明度后，您将获得li标记的背景色，因此请尝试在li标记中设置透明度

注意如果我们在任何元素中应用透明度，很明显，特定DOM元素的背景色变得透明，我们可以看到其父元素的背景色（在您的例子中，父元素是li）

要将渐变设置为透明，请将rgba（）的第四个参数

不透明度设置为0，此处标记为粗体字母

背景：线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0，0）75%）

在下面的例子中，我试图展示两种方法，可能是您想要的一种


ul{
列表样式：无；
填充：0；
保证金：0；
}
ullia{
显示：内联块；
颜色：白色；
浮动：左；
保证金：5px；
}
李{
显示：内联块；
框大小：边框框；
边际：0.12px；
填充：4px12px；
背景色：rgba（230、229、220、0.75）；
过渡：所有250ms；
边界半径：4px；
}
.透明背景{
背景：线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；
背景：-webkit线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；/*用于Safari 5.1到6.0*/
背景：-o-线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；/*歌剧11.1到12.0*/
背景：-moz线性渐变（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；/*对于Firefox 3.6到15*/
}
身体{
背景：线性梯度（向右，红色0，黄色75%）；
背景：-webkit线性梯度（向右，红色0，黄色75%）；
背景：-o-线性梯度（向右，红色0，黄色75%）；
背景：-moz线性梯度（向右，红色0，黄色75%）；
}
.透明背景1{
背景色：透明；
}














可能是您没有在正确的html标记中设置透明样式。
正如您所说，应用透明度后，您将获得li标记的背景色，因此请尝试在li标记中设置透明度

注意如果我们在任何元素中应用透明度，很明显，特定DOM元素的背景色变得透明，我们可以看到其父元素的背景色（在您的例子中，父元素是li）

要将渐变设置为透明，请将rgba（）的第四个参数
不透明度设置为0，此处标记为粗体字母

背景：线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0，0）75%）

在下面的例子中，我试图展示两种方法，可能是您想要的一种


ul{
列表样式：无；
填充：0；
保证金：0；
}
ullia{
显示：内联块；
颜色：白色；
浮动：左；
保证金：5px；
}
李{
显示：内联块；
框大小：边框框；
边际：0.12px；
填充：4px12px；
背景色：rgba（230、229、220、0.75）；
过渡：所有250ms；
边界半径：4px；
}
.透明背景{
背景：线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；
背景：-webkit线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；/*用于Safari 5.1到6.0*/
背景：-o-线性梯度（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；/*歌剧11.1到12.0*/
背景：-moz线性渐变（向右，rgba（230,229,220,0.75）0，rgba（0,0,0,0）75%）；/*对于Firefox 3.6到15*/
}
身体{
背景：线性梯度（向右，红色0，黄色75%）；
背景：-webkit线性梯度（向右，红色0，黄色75%）；
背景：-o-线性梯度（向右，红色0，黄色75%）；
背景：-moz线性梯度（向右，红色0，黄色75%）；
}
.透明背景1{
背景色：透明；
}














这可能是你最好的朋友：

这就是你要找的吗

白色-淡入透明背景


li{
显示：内联块；
框大小：边框框；
边际：0.12px；
填充：4px12px；
背景色：rgba（230、229、220、0.75）；
过渡：所有250ms；
边界半径：4px；
}
李{
/*Permalink-用于编辑和共享此渐变：http://colorzilla.com/gradient-editor/#ffffff+51,7db9e8+100和0.9+51,0.01+100*/
背景：-moz线性梯度（左侧，rgba（255255255,0.9）51%，rgba（125185232,0.01）100%）；
/*FF3.6-15*/
背景：webkit线性梯度（左侧，rgba（255255255,0.9）51%，rgba（125185232,0.01）100%）；
/*铬10-25，Safari5.1-6*/
背景：线性梯度（向右，rgba（255255255,0.9）51%，rgba（125185232,0.01）100%）；
/*W3C、IE10+、FF16+、Chrome26+、Opera12+、Safari7+*/
过滤器：progid:DXImageTransform.Microsoft.gradient（startColorstr='#e6ffffff'，endColorstr='#037db9e8'，GradientType=1）；
/*IE6-9*/
}
.左箭冠军，
.右翼赢家{
光标：指针；
字体：18px/32px图标；
位置：绝对位置；
顶部：4px；
}
.左箭冠军{
左：0
}
李先生
li {
    display: inline-block;
    box-sizing: border-box;
    margin: 0 12px;
    padding: 4px 12px;
    background-color: rgba(230, 229, 220, 0.75);
    transition: all 250ms;
    border-radius: 4px;
}

.left-arrow-winners , 
.right-arrow-winners {
    cursor: pointer;
    font: 18px/32px icomoon;
    position: absolute;
    top: 4px;
}

.left-arrow-winners {
    left: 0
}

.right-arrow-winners {
    right: 0
}

.left-arrow-winners:before {
    content: "\e92a";
}

.right-arrow-winners:before {
    content: "\e92b";
}