【CSS】class动态类名的书写

1.正常html里，一个标签无法同时写两个 class，只有位置靠前的第一个class类名生效

我们只能用将不同类名写入标签的class属性并用空格隔开

---

2.vue允许 ★静态类名staticClass + 动态类名dynamicClass

这里类名加不加单引号，要看你绑定时是否为字符串。如果是字符串，动态类么的书写无需额外在加单引号。自己测试
<div class="staticClass" v-bind:class="dynamicClass"><div />
简写： <div class="staticClass" :class="'dynamicClass'"><div />

---

3.动态类名写作js表达式（推荐三元运算符）

如果条件condition为真，则使用动态类dynamicClass，若条件condition为假，则使用默认类defaultClass
<div :class=" condition ? 'dynamicClass' : 'defaultClass' "><div />

---

4.多个动态类名用数组或者对象表示

可以直接将需要的动态类名写进数组里，对象形式的话，可以通过开关真/假来控制动态添加需要控制的样式