新增字體漸層色CSS樣式到主題
.gradient{
background: linear-gradient(to right, #ff6b6b, #4DA1F4); /* 从左到右的渐变 */
-webkit-background-clip: text; /* 只对文本应用背景 */
color: transparent; /* 使文本颜色透明，背景渐变色显示出来 */
font-weight: bold;
}
可以透過修改：background: linear-gradient(to right, #ff6b6b, #4DA1F4); 這行程式碼，調整文字漸層的效果。
- 「to right」是漸變的方向
- 也可以透過度數調整漸變的角度“45deg”
- 「to right」後面的參數是漸層顏色，可以填寫多個顏色
- 顏色可以是「#ffffff」這樣的色號，或者是「red」這樣的單字形式
新增CSS代碼後記得儲存。
WordPress設定漸層色字體
開啟文章或頁面的編輯頁面。
為想要新增漸層效果的文字元素新增類別名稱「gradient」。
這個類別名稱和我們加入css程式碼時的類別名稱一致。
文字漸層色效果預覽：
背景：線性漸層（向右，#ff6b6b，#4DA1F4）；
向右漸變，兩個漸層色。
背景：線性漸變（向右，紫色，#ff6b6b，#4DA1F4，紅色）；
向右漸變，四漸層色。
背景：線性漸變（到頂部，紫色，#ff6b6b，#4DA1F4，紅色）；
向上漸層。
越大的字體，漸層效果會更明顯。
只想為指定區域或元素添加CSS樣式請參考在WordPress中加入CSS代碼。
至此，為WordPress設定字體漸層教學結束。
還推薦你看：自訂WordPress後台登入頁面樣式
谷歌一鍵登入