CSS3豎排文字顏色漸變是一種最近比較流行的設計方式，在網頁中運用這種效果可以為頁面增添一份時尚感，讓頁面更具有視覺沖擊力。

/* 實現豎排文字顏色漸變 */
h1 {
writing-mode: vertical-lr;
text-orientation: upright;
background: -webkit-linear-gradient(yellow, orange); 
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

上述代碼中，我們先設置了文字方向為vertical-lr（從上往下豎排），然后將文字方向調整為upright，此時文字就可以正確顯示。接下來，我們使用background屬性，設置了線性漸變從黃色到橙色，然后只作用于文本的背景。接著，我們將文本顏色設置為透明的，這樣就達到了豎排文字顏色漸變的效果。

需要注意的是，這種效果在不同瀏覽器中可能會有兼容性問題，因此我們應該對不同瀏覽器分別進行適配。

/* 兼容性處理 */
h1 {
writing-mode: vertical-lr;
text-orientation: upright;
background: -webkit-linear-gradient(yellow, orange); 
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Firefox 兼容 */
-moz-transform: rotate(-90deg);
-moz-transform-origin: top left;
/* IE 兼容 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff00', endColorstr='#ff6600', GradientType=0);
}

上述代碼中，我們針對Firefox瀏覽器使用了-moz-transform屬性，并設置旋轉角度為-90度，并設置旋轉原點為top left。對于IE瀏覽器，我們使用 filter 屬性，設置了漸變顏色為黃色到橙色，GradientType=0 表示漸變方向為從上到下。

總之，通過 CSS3豎排文字顏色漸變，我們可以為網頁增加一份時尚感，提升頁面的視覺效果。同時，我們還需要對不同瀏覽器進行適配，使得這種效果在各種瀏覽器中都能正確顯示。