<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常用指令-绑定CSS
</title>
<script src="js/vue.js"></script>
<style>
.color{
color:red
}
.background{
background:blue
}
.size{
width:300px;
height:200px;
border:1px solid yellow;
}
.box{
border-radius: 20px;
box-shadow:2px 2px 2px #fff;
}
</style>
</head>
<body>
<div id="app">
<p :class="obj"></p>
</div>
<script>
let vue = new Vue({
el:"#app",
data:{
obj:{
'color':true,
'size':true,
'background':true,
'box':true
}
}
})
</script>
</body>
</html>
运行结果:
转载请注明原文地址: https://lol.8miu.com/read-35234.html