Vue教程6-style的绑定

style绑定

HTML标签中属性style是用来表述css样式的，但有的时候，我们的css样式不是固定的，所以我们不能直接写成普通的字符串,像是下面的例子，就是单纯可以将HTML组件写成固定的css样式。

<div style='height: 500px; width: 500px;'/>

当我们需要进行动态的css样式绑定时，我们就需要利用v-bind。

<div :style='Object' />

data:{
	Object: {
		width: window.innerWidth + 'px',
		'background-color': 'red'，
		fontSize: 30 + 'px'
	}
}

像是上面的例子，对于这种background-color较为复合的名字，在js里面是要使用引号‘’来括上，也可以使用fontSize驼峰命名法。