CSS做垂直輪播是網頁設計中非常常見的功能，通過簡單的樣式調整就可以實現頁面元素的垂直滾動，讓內容更加豐富和有趣。

<div class="wrap">
<ul class="list">
<li>第一條消息</li>
<li>第二條消息</li>
<li>第三條消息</li>
<li>第四條消息</li>
<li>第五條消息</li>
</ul>
</div>

如上方代碼所示，首先需要一個容器wrap，設定好它的寬度、高度和隱藏形式。在容器內部，鋪設一個ul的列表list，并且確定第一個li元素的頂部在容器頂部。最后一個關鍵點是設置動畫，使用@keyframes和animation屬性。通過設置top的正負值來達到不同的垂直方向滾動效果，當滾動到最上面時，再從底部開始滾動，從而實現垂直輪播效果。