在網站建設中，漂亮的PPT幻燈片常常是必不可少的展示方式。而CSS作為前端的重要一環，也可以用來實現PPT幻燈片的效果。

<!--html結構-->
<div class="slides">
<div class="slide"></div>
<div class="slide"></div>
<div class="slide"></div>
</div>
<!--css樣式-->
.slides {
position: relative;
width: 100%;
height: 100%;
}
.slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 20px;
font-size: 30px;
text-align: center;
background-color: #fff;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
transition: transform 1s;
}
<!--JS代碼-->
const slides = document.querySelectorAll('.slide');
let currentSlide = 0;
function nextSlide() {
slides[currentSlide].classList.remove('active');
currentSlide = (currentSlide + 1) % slides.length;
slides[currentSlide].classList.add('active');
}
setInterval(nextSlide, 5000);

這里首先定義了一個類名為slides的div容器，里面包含了三個類名為slide的div元素。slide元素的樣式包括了基本的樣式屬性，以及box-shadow實現的陰影效果和transition實現的動畫效果。通過JS的nextSlide函數可以實現每隔5秒鐘自動切換到下一張slide的效果。

當然，除了自動播放，我們也可以通過JS事件響應來控制幻燈片的切換效果，再加上一些動態的元素效果，可以讓PPT幻燈片更加生動有趣。