web-dev-qa-db-ja.com

vuetify v1.1 vカードの色に透明度を設定できますか？

現在、私は次のようにvカードを表示しています：

                      <v-parallax :src="require('../../assets/images/member.jpeg')" height="100%">
                        <v-container grid-list-xl pt-5 style="max-height: 10em;">
                        <v-layout row justify-center align-center>
                          <v-flex xs6 sm6 md3>
                            <v-card class="member__account flexcard">
                              <v-card-title class="section__title justify-center">
                                <div class="headline mt-1 mb-1 display-1 text-xs-center">MY ACCOUNT</div>
                              </v-card-title>
                            </v-card>
                          </v-flex>
                        </v-layout>
                      </v-container>

...

トリトル「マイアカウント」が白いvカードの背景にbalc表示されます

ただし、下にv視差画像があり、vカードの白い背景に透明度を設定して、視差画像が少し内側に見えるようにしたいと思います....

出来ますか ？はいの場合、どのように...フィードバックをありがとう

vue.jsvuetify.js
4
user762579

解決しよう：デフォルトの.transparentクラスを変更するだけです：

から

.transparent {
  background-color: transparent!important;
  border-color: transparent!important;
 }

に

.transparent {
   background-color: white!important;
   opacity: 0.65;
   border-color: transparent!important;
 }
3
user762579

rgbをcolorプロパティで使用できます。こんな感じです

<v-card color="rgb(255, 0, 0, 0.2)"> </v-card>

rgbの最後の値に透明度を設定できます。 rgb（color、color、color、setTransparency）

透明度の値を0〜1に設定できます。

1 =透明なし0 = 100％透明

2
MAS