CSS動畫是一種可以使網頁更為生動的技術，在這里我們將介紹CSS從下往上動畫。

代碼：
.anim {
position: relative;
animation: moveUp 2s ease forwards;
transform: translateY(100%);
}
@keyframes moveUp {
to { transform: translateY(0); }
}

首先我們需要定義一個元素，并給它一個position: relative的屬性值，這是由于我們接下來要使用transform屬性來移動它。然后，我們定義一個名稱為moveUp的動畫，并在我們的元素上使用animation屬性來將它應用于動畫。我們指定了2秒鐘的duration（持續時間），并將動畫的timing function（時間函數）設置為“ease”，這將使動畫以緩慢開始，并在結束時變得緩慢。最后一個屬性是“forwards”，它指示動畫完成后應保持選定狀態。然后，我們使用“translateY()”來將元素從底部向上移動（100%意味著元素應該向頂部移動一個它自己高度的距離）。

接下來，我們需要定義我們的動畫。這是通過關鍵幀和“@keyframes”規則完成的。我們使用“to”語法指定元素的最終狀態。

最后，我們需要測試動畫是否正常工作。你可以在你的Web瀏覽器中加載HTML文件，然后應該看到一個從底部向上移動的元素。如果你想添加從左到右或從右到左的動畫，可以使用transform屬性中提供的其他CSS轉換，如translateX()。

總結：

CSS動畫是一個靈活的技術，可以用很多方式創建動畫。從下往上動畫是一種不錯的形式，可以在網站中添加更多的生動感。如果你想要學習更多的CSS動畫，你可以查看其他HTML和CSS的教程或是CSS動畫的示例。