使用class样式
1.数组
1 | <h1 :class = "['red, 'thin']"></h1> |
2.数组中使用三元表达式
1 | <h1 :class = "['red', 'thin', isactive?'active':'']"></h1> |
3.数组中嵌套对象
1 | <h1 :class = "['red', 'thin', {'active':isactive}]"></h1> |
4.直接使用对象
1 | <h1 :class = "{red:true, thin:true, active:true}"></h1> |
使用内联样式
1.直接在元素上通过:style的形式，书写样式对象
1 | <h1 :style = "{color: 'red', 'font-size':'40px'}">文字</h1> |
2.将样式对象定义在data中，并直接引用到:style中