Heim> Web-Frontend> View.js> Hauptteil

vue如何动态增加css

醉折花枝作酒筹
Freigeben: 2023-01-13 00:45:19
Original
12647 Leute haben es durchsucht

vue如何动态增加css的方法是:1、在元素中绑定动态样式,语法“

”;2、在data中定义数据对象;3、在css中写样式。

本教程操作环境:windows7系统、vue2.9.6版、Dell G3电脑。

第一步:在元素中绑定动态样式

1.添加单个样式

Nach dem Login kopieren

2.添加多个样式

Nach dem Login kopieren

第二步:data中定义数据对象

data: { addInviteHeight1: '', // 弹框的高度 addInviteHeight2: '', // 弹框的高度 lightBlue: 'lightBlue', // lightBlue是css中定义的样式名 }
Nach dem Login kopieren

第三步:在css中写样式

.addInviteHeight1 { height: 52.5rem; } .addInviteHeight1 { height: 48rem; } .lightBlue { background-color: #6e9dd3; }
Nach dem Login kopieren

【推荐学习:javascript高级教程

Das obige ist der detaillierte Inhalt vonvue如何动态增加css. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!