以下讨论的是和相关的Vue中使用的几种样式的简单介绍（附代码） 教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

使用class样式

1.数组

  
这是一个邪恶的H1

2.数组中使用三元表达式

  
这是一个邪恶的H1

3.数组中嵌套对象

  
这是一个邪恶的H1

4.直接使用对象

  
这是一个邪恶的H1

使用内联样式

1.直接在元素上通过 :style 的形式，书写样式对象

  
这是一个善良的H1

2.将样式对象，定义到 data 中，并直接引用到 :style 中

• 在data上定义样式：

 data: {
      h1StyleObj: { color: 'red', 'font-size': '40px', 'font-weight': '200' }
 }

• 在元素中，通过属性绑定的形式，将样式对象应用到元素中：

 
这是一个善良的H1

3.在 :style 中通过数组，引用多个 data 上的样式对象

• 在data上定义样式：

  data: {
        h1StyleObj: { color: 'red', 'font-size': '40px', 'font-weight': '200' },
        h1StyleObj2: { fontStyle: 'italic' }
  }

• 在元素中，通过属性绑定的形式，将样式对象应用到元素中：

 
这是一个善良的H1

关于Vue中使用的几种样式的简单介绍（附代码）的内容写到这里就结束啦，您可以收藏本页网址http://www.alixixi.com/web/ a/2018081096017.shtml方便下次再访问哦。