CSS是一種用于網(wǎng)頁(yè)設(shè)計(jì)的語(yǔ)言，可以方便地改變網(wǎng)頁(yè)的外觀。其中一個(gè)常見的需求就是雙擊改變背景的效果。下面將介紹如何實(shí)現(xiàn)這個(gè)效果。

/* 首先，創(chuàng)建一個(gè)含有背景圖片的樣式類 */
.bg-image {
background-image: url('background.jpg');
background-repeat: no-repeat;
background-size: cover;
}
/* 接著，創(chuàng)建一個(gè)含有背景顏色的樣式類 */
.bg-color {
background-color: steelblue;
}
/* 最后，在JavaScript中綁定雙擊事件，切換兩個(gè)樣式類 */
var bodyElement = document.getElementsByTagName('body')[0];
bodyElement.addEventListener('dblclick', function() {
bodyElement.classList.toggle('bg-image');
bodyElement.classList.toggle('bg-color');
});

上述代碼中，我們首先創(chuàng)建了兩個(gè)樣式類，分別是帶有背景圖片和背景顏色的類。然后，在JavaScript中，我們使用addEventListener方法將雙擊事件綁定到元素上，并使用classList.toggle方法切換兩個(gè)樣式類。這樣，每次雙擊后，背景就會(huì)從圖片變?yōu)轭伾?，或者從顏色變?yōu)閳D片。