前些天發(fā)現(xiàn)了一個(gè)巨牛的人工智能學(xué)習(xí)網(wǎng)站，通俗易懂，風(fēng)趣幽默，忍不住分享一下給大家。點(diǎn)擊跳轉(zhuǎn)到教程。

代碼：

<template><div id="app"><!-- JSON方式使用樣式 --><div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }">樣式使用小例</div><!-- 原始樣式使用 --><div style="color: green; font-size: 18px;">此行樣式同于上一行</div><!-- 對(duì)象方式使用樣式 --><div v-bind:style="styleObject">樣式同于上2行 </div><!-- 數(shù)組方式使用樣式 --><div v-bind:style="[styleObject, overridingStyles]">我只是在前面基礎(chǔ)上把字體加粗</div></div> </template><script>export default {data () {return {activeColor: 'green',fontSize: 18,styleObject: {color: 'green',fontSize: '18px'},overridingStyles: {'font-weight': 'bold'}}}} </script>

運(yùn)行效果：（紅框中）

總結(jié)

以上是生活随笔為你收集整理的Vue.js 极简小例： 4 种方式样式绑定、style 的多种方式实现的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。