代码之家 › 专栏 › 技术社区 › Brad

Vuetify文本颜色变体

vuetify.js vue.js css

1

Brad · 技术社区 · 6 年前

我想在文本中使用其中一种颜色变体,我该怎么做?我已经尝试过:

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

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

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

还有许多其他的变体,但我只能让文本变成红色底色,而不是列出的变体。 here . 有人能帮忙吗?

2 回复 | 直到 6 年前

1

2

fila90 6 年前

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

从文档

文本颜色还支持使用文本-变亮变暗-n_

或者你可以检查元素并从中提取类

2

Begueradj 6 年前

您必须这样使用它:

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

为了 darken-{n} 和 lighten-{n} 预修复 text 而不是附加它。

实际上甚至还有一个 example 在文档中几乎和您的一样:

<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>

演示 here :

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

结果是: