先看如下效果：

十分钟课堂

实现方式：

先给文本写背景，再通过文本的轮廓对背景添加蒙版/遮罩（通俗点讲就是让背景通过文字显示出来）。再把文本的颜色变透明。这样就可以得到效果了。
 
就上面的效果而言，样式表是这样的：

/* 使文本父容器的宽度正好跟文本宽度一致 */
h1.special_gradient_text{
    display:flex;
    justify-content:flex-start;
}
/* 让文本的背景通过文本偷过来。 */
h1.special_gradient_text strong{
    color: #99d240;
    background: -webkit-gradient(linear,left top,right top,color-stop(32%,#99d240),color-stop(100%,#39be76));
    background: -webkit-linear-gradient(left,#99d240 32%,#39be76 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display:block;
}

IE默认是不支持的。兴许有什么办法也能支持。
Who knows.