CSS粒子浮動是近年來很受歡迎的一種前端效果，它使用CSS 3動畫屬性和偽元素在頁面上生成了很多漂浮的小球，給人一種非常靈動的視覺效果。

這種效果的實現并不難，只需要一些基本的CSS知識和一些對CSS 3動畫屬性的理解就可以了。

.particle {
position: absolute;
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #ffffff;
box-shadow: 0 0 10px #ffffff;
animation: particle-floating 5s linear infinite;
}
@keyframes particle-floating {
from {
top: 0;
opacity: 1;
}
50% {
top: 50%;
opacity: 0.7;
}
to {
top: 100%;
opacity: 0;
}
}
.container {
position: relative;
width: 500px;
height: 500px;
background-color: #333333;
}
.container::before {
content: '';
position: absolute;
top: -10px;
left: -10px;
right: -10px;
bottom: -10px;
z-index: -1;
background-color: rgba(255, 255, 255, 0.2);
filter: blur(10px);
}

以上代碼中，“.particle”類定義了這些漂浮小球的基本樣式，包括位置、大小、形狀、顏色和動畫屬性等等。“.container”類用來定義容器的大小和背景顏色。

這里通過偽元素::before來為容器添加了一個背景模糊效果，使漂浮的小球更加突出。

動畫部分通過@keyframes關鍵字定義，從初始狀態開始，逐漸改變小球的位置和透明度，最終消失在容器的底部。這個動畫會不斷循環，從而讓小球始終在頁面上漂浮。

使用CSS粒子浮動可以為網站添加一定的視覺效果，提升用戶的體驗和感受。當然，注意不要過度使用，以免影響頁面的整體性和可用性。