<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<script type="text/javascript" src='vue.min.js'></script>
	<title></title>
	<style type="text/css">
		body{
			background-color: #ccc;
		}
	</style>
</head>
<body>
<input type="button" name="" id="" value="changed" @click="set"/>
<div :style="myDiv">
	
</div>
	<script type="text/javascript">
		new Vue({
			el:'body',
			data:{
				myDiv:{
				'width':'200px',
				'height':'200px',
				'background':'red',
				'transition':'.5s'
			}
		},
		methods:{
			set:function()
			{
				this.myDiv.width='400px';
				this.myDiv.height='400px';
				this.myDiv.background='green';
			}
		}
		});
	</script>
</body>
</html>

解释：

vue.js style（核心）_数组
:style和:class差不多，但是只持json 数组 字符串

效果：

vue.js style（核心）_html_02