如何修改vux的css样式

以panel为例

在div定义class

<div class="chargeRecordPage">
    <group title="充电记录">
      <panel :list="list" :type="type"></panel>
    </group>
  </div>

但是如何修改panel 的样式呢

<style scoped>
.chargeRecordPage /deep/ .weui-media-box {
  padding: 14px;
}
.chargeRecordPage /deep/ .weui-media-box__desc {
  margin: 1px;
}
.chargeRecordPage >>> .weui-media-box__info {
  margin: auto;
}
.chargeRecordPage >>> .weui-media-box__desc {
  font-size: 14px
}

 可以在类名后面加/deep/ 或者>>>即可修改。

 

ps:

color: brown!important;

!important 写在后方的意思是优先级最高。

一般网页加载是从外层慢慢加载的，若是内层的样式与外层冲突，取内层的样式。

若想要某一层的某个属性优先级最高，可以加!important