透過昨天的範例我們知道要綁定HTML屬性需要使用v-bind指令，而今天我們要介紹的是v-bind綁定class和style
我們一樣先來看一段官網中對於class和style綁定的介紹

A common need for data binding is manipulating an element’s class list and its inline styles. Since they are both attributes, we can use v-bind to handle them: we only need to calculate a final string with our expressions.

在今天的範例中使用到的是inline style的綁定，他看起來很像CSS但他其實是JavaScript的物件，所以在JavaScript的部分使用了一個colors陣列，把紅、綠、藍三個物件裝起來，讓使用者能夠透過點擊button來改變字的顏色，這個範例中還設計了一個當使用者將滑鼠移到Hello Vue.js時他會有'歡迎來到Vue.js'的提示效果

最後來回顧一下到目前為止介紹的3種綁定:
{{ }}他是做text的資料綁定，v-bind是做屬性綁定，他可以解決{{}}不能綁定在HTML屬性的問題，所以它可以綁定HTML屬性像是照片、連結等，而v-model則是做表單的綁定，像是文字輸入框、單選、多選以及下拉式選單等

github