vuejs basis -style style

Class样式


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="vue.min.js" ></script>
		<style>
			.red{
				color:red;
			}
			
			.thin{
				font-weight:200;
			}
			
			.italic{
				font-style:italic;
			}
			
			.active{
				letter-spacing: 0.5em;
			}			
		</style>
	</head>
	<body>
		<div id="app">
			<!--<h1 class="red thin">这是一个测试标签，看它的变化</h1>-->
			
			<!--<h1: class = "[ 'red', 'thin', 'italic']"> This is a test label to see if it changes </ h1> ->
			
			<- <h1:! class = "[ 'red', 'thin', flag 'active': ''?]"> This is a test label to see if it changes </ h1> -> 
			
			<-! - <h1: class = "[ 'red', 'thin', {active: flag}]"> this is a test label to see if it changes </ h1 of> -> 
			
			<h1 of: class = "{Red: true, thin: false, active: flag} "> this is a test label to see if it changes </ h1 of> 
			
			<- <h1 of:! class =" classObj "> this is a test label to see if it changes < / h1 of> -> 
			
		</ div> 
	</ body> 
	
	<Script> 
		new new Vue ({ 
			EL: "App #", 
			Data: { 
				In Flag: to true, 
				classObj: {Red: to true, Thin: to false, Active: to true} 
			}, 
			Methods: {} 
		}); 
	</ Script> 
</ HTML>
vuejs basis -style style

Guess you like
