CSS中的下沉指的是文本或元素向下移動(dòng)的效果，通常用于制作按鈕、展開(kāi)菜單等效果。

/* 使用CSS的定位屬性可以實(shí)現(xiàn)下沉效果 */
.box {
position: relative; /* 設(shè)置相對(duì)定位 */
top: 10px; /* 向下移動(dòng)10像素 */
}

在上述代碼中，我們給.box元素添加了相對(duì)定位，然后使用top屬性將元素向下移動(dòng)10像素。

/* 使用CSS3的動(dòng)畫屬性可以實(shí)現(xiàn)平滑下沉效果 */
.box {
animation: sink 0.5s ease-in-out; /* 添加動(dòng)畫效果 */
}
@keyframes sink {
0% {
transform: translateY(0); /* 初始狀態(tài) */
}
100% {
transform: translateY(10px); /* 結(jié)束狀態(tài) */
}
}

在上述代碼中，我們使用CSS3的動(dòng)畫屬性給.box元素添加了名為sink的動(dòng)畫，并設(shè)置了動(dòng)畫的持續(xù)時(shí)間和緩動(dòng)函數(shù)。同時(shí)，我們還定義了動(dòng)畫的起始狀態(tài)和結(jié)束狀態(tài)，通過(guò)transform屬性將元素在Y軸方向偏移10像素。

無(wú)論是使用CSS定位還是CSS3動(dòng)畫，都可以實(shí)現(xiàn)元素下沉的效果。在實(shí)際應(yīng)用中，我們可以根據(jù)具體需求選擇合適的方法來(lái)實(shí)現(xiàn)下沉效果。