如何为文本从颜色到颜色制作渐变？ [复制]答案

【问题标题】：How to make a gradient for text from color to color? [duplicate]如何为文本从颜色到颜色制作渐变？ [复制]
【发布时间】：2020-12-30 19:08:03
【问题描述】：

如何使文本从颜色到颜色渐变？

 .gradient {
     background: linear-gradient(to right, blue, green 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     font-size: 300%;
  }

&lt;div class="gradient"&gt;COUNTRY&lt;/div&gt;

【问题讨论】：

display:table (或 dispaly:inline-block) 到 div
也添加 div display:inline .because Div has width:100%;所以文字太小了。
它使文本的宽度具有div的宽度:)
谢谢，我使用 display:inline ，它可以根据需要工作。
您为什么接受一个没有提供似乎适合您的解决方案的答案？这没有意义

标签： html css

【解决方案1】：

更改您的“绿色”颜色百分比，例如：

background: linear-gradient(to right, blue, green 10%)

【讨论】：

【解决方案2】：

我对你的 CSS 做了一些修改。

          .gradient {
font-size: 72px;
      background: linear-gradient(to right, blue 10%, green 50%);
      background-image: linear-gradient(to right, blue 10%, green 50%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
}

&lt;div class="gradient"&gt;COUNTRY&lt;/div&gt;

你可以试试这段 CSS 代码。

【讨论】：

全屏打开是不行的。
Div 有 width:100% 添加display:inline .
谢谢，我使用 display:inline ，它可以根据需要工作。