概念:

1.先用linear-gradient  在background 做出漸層效果 

background: -webkit-linear-gradient(bottom,#81411a 0,#8f5622 26%,#9b692a 50%,#c09034 100%);
(起始位置，顏色代碼 階段)

2. 使用background-clip，用text把background clip

-webkit-background-clip: text;
(chrome 瀏覽器要加-webkit-)

3.最後把文字設成 trasparent 這樣會吃到背景的顏色

-webkit-text-fill-color: transparent;


HTML

<div class="content">
    <h1>漸層文字</h1>
</div>
 
CSS

.content{

background: -webkit-linear-gradient(bottom,#81411a 0,#8f5622 26%,#9b692a 50%,#c09034 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

}

文章都是幫助自己記憶複習的，有錯請多多指教謝謝。