vuetify <v-list-tile> 元素不应用颜色属性答案

【问题标题】：vuetify <v-list-tile> element does not apply color attributevuetify <v-list-tile> 元素不应用颜色属性
【发布时间】：2019-09-04 12:52:12
【问题描述】：

我有以下列表设置，但无法为v-list-tile 设置颜色，它似乎保持无色。这是模板：

 <v-container>
      <v-flex xs12>
        <v-card color="rgba(75,75,75,1)">
          <v-card-title><h4>Details</h4></v-card-title>
          <v-divider></v-divider>
          <v-list dense>
            <v-list-tile v-for="(value,key) in testData" dark color="rgba(85,85,85,1)">
              <v-list-tile-content >{{key}}</v-list-tile-content>
              <v-list-tile-content class="align-end">{{value}}</v-list-tile-content>
            </v-list-tile>
          </v-list>
        </v-card>
      </v-flex>
    </v-container>

这就是结果。只有v-card 似乎应用了颜色属性 v-divider 下面的所有内容都不会改变它的颜色

【问题讨论】：

标签： html vue.js vuetify.js

【解决方案1】：

在 v-list-tile 中，颜色属性仅改变文本的颜色。

如果你想为背景设置样式，最简单的方法是使用内联样式。

<v-list-tile
  style="background-color:rgba(85,85,85,1)"
  ...
</v-list-tile>

【讨论】：