Vuetify 文字颜色变体

Question

我想使用文本的其中一种颜色变体，我该怎么做？我已经尝试过：

```

My Address

My Address

My Address

```

和许多其他变化，但我似乎只能得到文本的基本红色，而不是列在这里的变体。有人可以帮忙吗？

- Brad

Answer 1

class="red--text text--lighten-5"

来自文档

文本颜色还支持使用text--{lighten|darken}-{n}的明暗变体

或者您可以检查元素并从中选择类

- fila90

---

我现在明白了，不知道为什么我没读到那一行。谢谢伙计。 - Brad

你在哪里设置整个应用程序的默认文本颜色？似乎找不到相应的变量！Vuetify添加了0.87的不透明度，但我不确定这是在哪里发生的。 - trainoasis

https://vuetifyjs.com/en/features/theme/#customizing - fila90

Answer 2

您必须这样使用：

<h2 class="red--text text--lighten-1">My Address</h2>

对于darken-{n}和lighten-{n}，在前面添加text而不是后面添加。

实际上，文档中甚至有一个示例与您的要求几乎完全相同。

<template>
  <div>
    Lorem ipsum dolor sit amet, <strong class="red--text text--lighten-1">inciderint</strong> definitionem est ea, explicari prodesset eam id. Mazim doctus vix an. <span class="indigo--text text--darken-2">Amet causae probatus nec ex</span>.
  </div>
</template>

这里有一个演示链接:

<h2 class="red--text text--lighten-1">My Address</h2>.
<h2 class="red--text text--lighten-2"> My Address</h2>.

结果是这样的：

- Begueradj