使用CSS向文本添加特定渐变

Question

我有一个包含文字的图片，但上传并显示它并没有帮助谷歌搜索真的找到它所以我想知道我是否可以在我的文字上获得特定的渐变样式。

这是文本的外观。

有人可以帮助我实现这个目标吗？

我发现了这个，但我真的不知道如何调整它。

＆＃13;

＆＃13;

.h1 {
      font-size: 72px;
      background: -webkit-linear-gradient(#eee, #333);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;}

＆＃13;

    <span class="h1">Ανανέωσε ONLINE & πάρε ΔΩΡΟ MB</span>

＆＃13;

＆＃13;

＆＃13;

提前致谢。

Answer 1

你应该谷歌搜索linear gradient或在其中找到w3c

.h1 {
      margin: auto;
      font-size: 52px;
      font-weight: bold;
      background: linear-gradient(to right, #438f3a , #19acdf);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;}
.h1h {
    background: black;
}   

<div class="h1h" ><div class="h1">Ανανέωσε ONLINE & πάρε <br/>ΔΩΡΟ MB!</span></div>

Answer 2

.black-background {
  background: #408e38;
}
.top-clip {
  background: #0d0d0d;
    -webkit-clip-path: polygon(10% 0, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 20%);
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 50% 100%, 0 100%, 0 20%);
  padding: 20px;
}

.h1 {
      font-size: 72px;
      background: linear-gradient(to right, #4cab49 , #1eacce);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
}

<div class="black-background">
  <div class="top-clip">
    <span class="h1">Ανανέωσε ONLINE & πάρε ΔΩΡΟ MB</span>
  </div>
</div>