CSS動畫浮動是網頁設計中常用的一種樣式，特別是在導航欄菜單等元素中，使用浮動可以讓頁面看起來更加美觀。接下來，我們將介紹如何通過CSS實現浮動動畫效果。

.nav {
display: flex;
justify-content: center;
}
.link {
margin: 10px;
padding: 10px;
border-radius: 5px;
background-color: #fff;
transition: all 0.3s ease;
}
.link:hover {
transform: translateY(-5px);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

以上代碼中，我們首先通過flex布局讓導航欄元素水平居中。然后，每個導航欄鏈接都添加了10px的外邊距和10px的內邊距，以及圓角和背景色。通過transition屬性，我們給導航欄鏈接添加了一個0.3s的簡單過渡動畫。

當鼠標懸停在導航欄鏈接上時，我們通過:hover偽類來添加動畫效果。使用transform屬性，我們將鏈接向上移動5像素，然后使用box-shadow屬性添加了一個灰色的陰影，以增強鏈接的立體感。

通過這些簡單的CSS屬性和過渡動畫，我們成功地創建了一個漂亮的浮動動畫效果。