」;2、在data中定義資料物件;3、在css中寫樣式。"/> 」;2、在data中定義資料物件;3、在css中寫樣式。">
vue如何動態增加css的方法是:1、在元素中綁定動態樣式,語法「b52f20da03af8ce33ad4177376de66ac」;2、在data中定義資料物件;3、在css中寫樣式。
本教學操作環境:windows7系統、vue2.9.6版、Dell G3電腦。
第一步:在元素中綁定動態樣式
1.新增單一樣式
<div class="addInvTitle" :class="lightBlue">
2.新增多個樣式
<div id="addInvite" class="addInvite" :class="[addInviteHeight1, addInviteHeight2]">
第二步驟:data中定義資料物件
data: { addInviteHeight1: '', // 弹框的高度 addInviteHeight2: '', // 弹框的高度 lightBlue: 'lightBlue', // lightBlue是css中定义的样式名 }
第三步:在css中寫樣式
.addInviteHeight1 { height: 52.5rem; } .addInviteHeight1 { height: 48rem; } .lightBlue { background-color: #6e9dd3; }
【推薦學習:javascript高階教學】
以上是vue如何動態增加css的詳細內容。更多資訊請關注PHP中文網其他相關文章!