CSS數字切換動畫，可以讓數字在動態變化的過程中呈現出平滑流動的效果，增加了頁面的動態感。下面介紹一些實現該效果的CSS代碼：

.count-up {
text-align: center;
font-size: 48px;
color: #FFF;
font-weight: bold;
}
.count-up .number {
display: inline-block;
position: relative;
}
.count-up .number:before,
.count-up .number:after {
content: attr(data-number);
position: absolute;
opacity: 0;
}
.count-up .number:before {
top: -30px;
}
.count-up .number:after {
bottom: -30px;
}
.count-up .number.animate:before,
.count-up .number.animate:after {
opacity: 1;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.count-up .number.animate:before {
top: 0;
}
.count-up .number.animate:after {
bottom: 0;
}

這段CSS代碼包含了偽元素和動畫效果的設置。其中，偽元素:before和:after表示數字從上方和下方跳入的效果，通過設置它們的位置和透明度，實現數字的動態效果。動畫效果包括了類名為“animate”的設置，通過切換該類名，實現數字動畫效果的開啟和關閉。

要使用數字切換動畫效果，只需要給數字所在的HTML元素添加類名“count-up”，再給數字元素添加data-number屬性，即可開始動畫。

<div class="count-up">
<span class="number">5</span>
</div>

這段HTML代碼中，數字“5”被包裹在一個div元素中，并且給該元素添加了類名“count-up”，數字所在的span元素中添加了data-number屬性。通過JavaScript代碼，可以實現當元素滾動到可見區域時觸發動畫效果。