小程序 WXSS 内联样式style和类样式class

内联样式接受动态样式，在运行时会进行解析，用于控制样式的调整。定义单一元素，或使用中发生较大变化的元素。

类样式是用于统一类型的多个元素，重复使用的元素，从而减少重复代码的数量。

举例如下:

index.wxml

<view wx:for="{{data}}" wx:key="*this"  class="block" style="{{item.style}}">
Block{{index}}
<view>{{item.title}}</view>
</view>

 index.wxss

.block
{
  background-color: #eee;
  margin: 10rpx 0rpx;
}

index.js

Page({
  data: {
   data:[
     {
       "title":"Hi,NetEase",
       "style":"color:#ff00ff"
     },
     {
       "title":"HelloNetEase",
       "style":"color:#00ff00"
     }
   ]
  },

 这个为效果图。

 

 

 

这里wx:key是一个难点，如果像了解，请看我的另一个博客。https://blog.csdn.net/abudula__/article/details/81144390