在開發Web頁面時，我們經常使用全屏來展示內容，但是有時候用戶可能需要退出全屏模式，我們需要提供相應的功能來實現這一操作。在CSS中，我們可以使用以下代碼來實現退出全屏：

:fullscreen {
/* 全屏樣式 */
}
:fullscreen:active {
/* 退出全屏樣式 */
}
/* 退出全屏時的事件 */
document.addEventListener('fullscreenchange', (event) =>{
if (document.fullscreenElement) {
console.log('進入全屏模式');
} else {
console.log('退出全屏模式');
}
});
/* 點擊退出全屏按鈕 */
const exitFullscreen = () =>{
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
};

在CSS中，我們定義了兩個偽類，:fullscreen是全屏狀態下的樣式，:fullscreen:active是退出全屏狀態下的樣式。在JavaScript中，我們使用了fullscreenchange事件來檢測是否處于全屏狀態下，當退出全屏時，我們可以執行相應的操作。此外，我們還需要實現退出全屏的功能，這可以通過調用document.exitFullscreen()方法來實現。

總之，通過使用以上的代碼，我們可以很容易地實現退出全屏的功能，為用戶提供更好的使用體驗。