Javascript 我想使v-card透明，但它不'；我不能正常工作

我希望v型卡是透明的，但里面的东西不应该是透明的。我如何使用CSS制作它

card.vue

    <v-card class="cardColor">
      <v-card-text>
        TEXT
      </v-card-text>
      <v-card-actions>
        <v-btn color="primary" @click="foo">Button</v-btn>
      </v-card-actions>
    </v-card>

我试着写这个，但没用

    .cardColor {
       color: rgba(255, 255, 255, 0.5);
     }

---

在CSS中，我们可以通过以下方式实现：

.cardColor 
{ 
    z-index: 1; 
    position: relative; 
    width: 100%; 
    float: left; 
}

.cardColor:before 
{ 
    position: absolute; 
    content: ""; 
    display: block; 
    width: 100%; 
    height: 100%; 
    background: #fff; 
    opacity: 0.35; 
    top: 0; 
    left: 0; 
    z-index: -1; 
}

---

我把一个透明的卡片背景，并删除不透明度，这是你需要的吗

newvue({
el:“#应用程序”，
vuetify:新的vuetify（），
})
setTimeout（（）=>console.clear（），100）

#应用程序{
背景：线性梯度（向右，rgba（226,1）0%，rgba（254254,1）100%）；
}
cardColor先生{
背景色：rgba（255，255，255，0.5）！重要；
边框颜色：白色！重要；
}

正文
按钮

您可以将颜色属性用于

<v-card outlined color="transparent">
   ...
</v-card>

...

欢迎使用Stack Overflow(堆栈溢出)我不知道VueJS，但是如果你想让背景透明，那么CSS中的元素看起来好像是用错了方向(

背景颜色：白色！重要的应该是透明的，大概
边框颜色：透明！重要的应为白色更改父元素的不透明度将始终影响其所有子元素。从功能上来说，没有办法绕过这一点，所以你所描述的是不可能的。考虑提供一个目标的解释，而不是你尝试的解决方案；也许是一个屏幕截图或所需效果的模型。您可能可以使用一种变通方法来实现它。您需要用自己的方法覆盖
v-card
（背景、阴影等）上的Vuetify css定义。So
背景：透明
和
框阴影：初始值
等。不要添加不透明度，否则会影响所有内容。感谢您的回答，是的，我希望卡片透明，但不是100%透明，我认为大约为0.8-0.9透明。@Maks我编辑了片段，只将背景色透明度更改为带有所需值的rgba值，我希望这能对你有所帮助非常感谢你的帮助，这正是我想要的。
<v-card outlined color="transparent">
   ...
</v-card>