CSS是網(wǎng)頁設(shè)計中重要的一環(huán)，多種樣式可以打造出不同的網(wǎng)頁效果。其中，讓div上下滑動的效果是常用的一種，下面通過pre標簽展示如何使用CSS實現(xiàn)這一效果。

div{
position: relative;
animation: slide 2s linear infinite;
}
@keyframes slide {
0% {
top: 0px;
}
50% {
top: 100px;
}
100% {
top: 0px;
}
}

以上代碼中，我們?yōu)閐iv元素設(shè)置了相對定位，同時通過關(guān)鍵幀動畫實現(xiàn)了順序滑動效果。在animation屬性中，我們設(shè)置了動畫名稱、時間、緩沖效果和重復(fù)次數(shù)。

關(guān)鍵幀動畫中，則通過百分比調(diào)整滑動的距離，即使得元素有了不同的位置和大小。

除此之外，還可以通過設(shè)置div的高度和overflow屬性來控制元素的大小和滑動范圍，從而實現(xiàn)不同的滑動效果。經(jīng)過不斷地調(diào)整和細化，可以讓網(wǎng)頁更加生動有趣。