Vue.js之绑定style样式

上文介绍了如何利用Vue.js绑定类,本文将介绍通过Vue.js进行样式修改的另一种方法,即通过style来修改。

核心:为元素绑定style属性,通过对象的形式赋予样式,属性名为样式名(要使用驼峰命名法),属性值为字符串。若要引入多组样式,可以利用数组,后面出现的重复属性会覆盖之前的属性,如下例中的height。当然,也可以于元素行内赋予样式,例如:style="{backgroundColor:color}",这时可以通过在data中定义color数据控制样式的变化。





    
    
    
    Document
    



    

效果如图:

Vue.js之绑定style样式_第1张图片

你可能感兴趣的:(JavaScript,vue.js,javascript)