CSS是前端開發的重要基礎技能之一，其中文字垂直滾動是網頁設計中常用的效果。本文將介紹使用CSS實現文字垂直滾動的代碼。

.container {
height: 200px; /*容器高度*/
overflow: hidden; /*超出部分隱藏*/
position: relative; /*相對定位*/
}
.scroll {
position: absolute; /*絕對定位*/
top: 0;
left: 0;
animation: scroll 10s linear infinite; /*滾動動畫*/
}
@keyframes scroll {
from {
transform: translateY(0); /*起始位置*/
}
to {
transform: translateY(-100%); /*結束位置*/
}
}

首先，我們需要定義一個容器，用來包裹要滾動的文字。這個容器需要設置一個固定的高度，并將超出部分隱藏。

接著，我們需要定義一個文字滾動的類，需要將其絕對定位并設置頂部和左側坐標為0。然后，我們使用CSS3動畫實現文字的滾動效果。在這里，我們使用了一個無限循環的線性動畫scroll，它會根據CSS keyframes中定義的起始和結束位置，將文字移動到指定的位置。

最后，我們將滾動類添加到容器中即可實現文字垂直滾動的效果。

<div class="container">
<div class="scroll">
<p>這里是要滾動的文字</p>
</div>
</div>

以上是使用CSS實現文字垂直滾動的代碼，希望能幫助您實現更好的網頁設計效果。