Vuetify v-card は v-col で可能なすべての高さに適合します
P粉692052513
P粉692052513 2024-04-06 10:29:26
0
1
597

vue と vuetify を使用してログイン/登録ページを構築しています。 以下にコードを置きます (私はイタリア人なのでテキストはイタリア語ですが、理解できると思います):

リーリー

これを試してみると、「登録」(登録) カードの高さがログイン カードよりも低いことがわかります。見栄えを良くするために、高さをログインカードと同じにする方法(できればCSSを使用しますが、JSは使用しません)はありますか?

###ありがとう!良い1日を!

P粉692052513
P粉692052513

全員に返信(1)
P粉908138620

私が作成したこのコードサンドボックスを確認してください: https://codesandbox.io/s/stack-70836234-11sck?file=/src/components/CardHeight.vue

v-row から align="center" を削除します。次に、CSS height:100%v-card

に追加するだけです。

更新: モバイル ビューでのみ v-card に固定の高さを設定するには、vuetify の表示ブレークポイント を使用できます。この場合、それらを style 属性に適用しましたが、これは、任意の HTML 属性で使用でき、js のどこでも使用できます。

リーリー
いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート