CSS緩入緩出是CSS3中的一個非常有用的特性，能夠為網頁添加華麗的動畫效果。基本的CSS緩入緩出動畫有以下四種：

.fade-in {       /* 漸變顯示 */
opacity: 0;
transition: opacity 1s ease-in;
}
.fade-in:hover {
opacity: 1;
}
.fade-out {      /* 漸變消失 */
opacity: 1;
transition: opacity 1s ease-out;
}
.fade-out:hover {
opacity: 0;
}
.slide-down {
max-height: 0;
overflow: hidden;
transition: max-height 0.5s ease-out;
}
.slide-down:hover {
max-height: 1000px;
}
.slide-up {
max-height: 1000px;
overflow: hidden;
transition: max-height 0.5s ease-in;
}
.slide-up:hover {
max-height: 0;
}

可以根據自己的需要對這些基本的緩入緩出動畫進行修改，比如修改過渡時間、修改動畫方式等等。在實際開發中，CSS緩入緩出動畫非常常見，可以用來優化用戶體驗，增加交互性。