CSS跑流水是一種在網頁中運用動態樣式的方法，通常被用于顯示文字流動效果。下面我們會詳細介紹如何運用CSS跑流水。

首先，我們需要在HTML文件中添加一個包含文本內容的div標簽，并設置其寬度和高度：

<div class="container">
這里寫你要顯示的文字
</div>

接著，在CSS文件中我們需要設置動畫相關的屬性。通過使用@keyframes和animation屬性，我們可以實現CSS跑流水的效果。下面是一個簡單的例子：

@keyframes run {
0% { transform: translateX(0); }
100% { transform: translateX(-100%); }
}
.container {
width: 300px;
height: 50px;
overflow: hidden;
}
.container::before {
content: attr(data-text);
display: inline-block;
white-space: nowrap;
animation: run 5s linear infinite;
}

解釋一下上面的代碼：我們設置了一個名為“run”的動畫，其中0%表示動畫的起始狀態，100%表示動畫的結束狀態。在這個例子中，我們使用translateX屬性使文本向左移動。接著，在.container的偽元素::before中，我們展示了data-text屬性的值，并使用animation屬性應用了run動畫，從而使文本動起來。

最后，我們需要在HTML中添加data-text屬性，并將需要展示的文本作為其值：

<div class="container" data-text="這里是跑流水的文字"></div>

這樣，我們就成功地實現了CSS跑流水的效果。如果您想要調整速度、方向等動態效果，只需要在animation屬性以及@keyframes規則中進行微調即可。