在CSS3中及VUE中使用 var() 和 八位十六進制的顏色值
最近因為項目(vue)需求的改動，需要根據后天返回的數據來動態的去改變一些樣式。 剛開始也沒有什么好的方法，想過樣式的綁定，但是不行。想過使用 Jquery 來改變， 雖然可以，但是感覺太麻煩，而且有時候不太穩定。
最后，發現可以使用CSS3中的
var() 來聲明變量來使用。
var()是CSS3中的一個函數。定義：
var()函數用於插入自定義的屬性值。如果一個屬性值在在多處被使用，該方法就很有用。 在了解了CSS3中的
var()函數后，我還是很關心它的瀏覽器兼容性是如何的。
可以從MDN官方給出的數據中知道，這個CSS3中的var函數除了
IE 中不支持外，其他的瀏覽器除了版本極低的情況，都很好的支持了。 用法也很簡單：1、變量在聲明時必須以
-- 開頭。2、后面可以跟自定義屬性名。3、在var()使用自定義的屬性名。
在vue中用法類似，但vue可以同過樣式綁定的方式來聲明變量。
這樣就可以動態的去改變一些樣式，也不需要使用 Jquery。而且還可以多處使用。
這樣就可以動態的去改變一些樣式，也不需要使用 Jquery。而且還可以多處使用。
但是有時候，這樣也不能滿足需求，比如：如果給你的是十六進制的顏色值，但是在一些地方卻需要有一定的透明度。 可以將十六進制的顏色制顏色值轉化為rbga(或者有需要可以轉化為rgb)。如果能不轉化最好。 這里就需要用到
八位十六進制的顏色值
這是6位十六進制的顏色值
這是8位十六進制的顏色值
很明顯，可以看出8位十六進制的顏色值的最后兩位代表了透明度，值越小，越透明，值不能為100。
最后還有個坑，就是
IE 不支持這種寫法。所以，如果真的要
兼容IE就把 這種的寫法轉化為rgba的形式。
這里的透明度是寫成了固定的0.1，可以修改為動態的，多傳個參數透明度就行了。
這里的透明度是寫成了固定的0.1，可以修改為動態的，多傳個參數透明度就行了。