CSS和JS輪播是現代網頁設計中常用的效果之一，它可以幫助網頁美化并且提高信息呈現的效果。下面是一個簡單的CSS和JS輪播代碼示例。

/* CSS代碼 */
.slider {
width: 100%;
height: 500px;
position: relative;
overflow: hidden;
}
.slide {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
opacity: 0;
transition: opacity .5s ease;
}
.slide.active {
opacity: 1;
}
/* JS代碼 */
const slider = document.querySelector('.slider');
const slides = document.querySelectorAll('.slide');
let currentSlide = 0;
setInterval(() =>{
slides[currentSlide].classList.remove('active');
currentSlide = (currentSlide + 1) % slides.length;
slides[currentSlide].classList.add('active');
}, 5000);

上面這個示例中，HTML部分沒有給出，但是可以想象一個