vue绑定内联样式
对象语法由key和value
key就是样式属性名,value就是样式值(可以使用动态值,也可以静态值)
样式属性名包含特殊字符号,要么驼峰写法,要么使用引号包裹
我们可以在js中控制值的改变
将colorValue的值和我们data中的数据进行绑定,当data中的colorValue发生改变时,color样式也会发生改变
<div v-bind:style="{color:colorValue,fontSize:size,'font-weight':weight}">
我是div的内容
</div>
<script>
let vm = new Vue({
el : "#app",
data : {
colorValue:'blue',
size:'30px',
weight:'bold',
}
})
</script>