之前的html文件如何去绑定css样式?
 01.首先在html文件中,在<head>标签中,用<style>中去写样式,通过html标签(每一个标签都有这样子的属性)中的class或者是id属性来完成<style>中的描绘的样式的用。
 例子:
 先去写样式<style>,.basic就是用class选择器(此处的意思是class属性值是basic),id选择器是#
 
 同时用多个样式,就是一起用,只是用空格来隔开。
 
 这个是传统的在html文件中用css样式。
那么如何在vue中去绑定样式?
 用class或者id来获取样式:
 01.首先css样式还是要去写的,也就是还需要在头部标签head中去写,这边不改变。
 
02.在vue实例中的data中key值去写字段。这里的字段就是<style>中的写的class类选择器的名字。例如:data中的自定义的key 值是(mood)
 
03.在html标签中去用v-bind来绑定mood字段
 
 04.此外可以用一个事件来完成样式名称的改变。
 
 class属性的进一步的优化(数组包装,对象包装),这里的修改字段在浏览器中去完成的。
 
 
结果:
 
用标签的style属性来完成
 之前的html文件中标签用style属性,直接写样式。
 例如:

 在vue中,由于style是一个内部存在多个键值对的一个属性。一般就把style的许多字段写在一个对象(在data中)。
 
多个style
 