CSS3中的兩個背景切換效果是通過background-image屬性實現(xiàn)的，分別是background-size和background-clip。

/*使用background-size實現(xiàn)兩個背景切換*/
div{
background-image: url(bg1.jpg), url(bg2.jpg);
background-size: 100px 100px;/*第一個背景大小*/
background-position: 0 0, 10px 10px;/*第一個背景位置*/
}

上述代碼中，使用background-image同時加載bg1.jpg和bg2.jpg兩張背景圖片，然后使用background-size屬性分別定義了兩個背景圖片的大小。最后，需要使用background-position來定義每個背景圖片相對于容器的位置以達到切換的效果。

/*使用background-clip實現(xiàn)兩個背景切換*/
div{
background-image: url(bg1.jpg), url(bg2.jpg);
-webkit-background-clip: content-box, padding-box;
-moz-background-clip: content-box, padding-box;
background-clip: content-box, padding-box;
}

上述代碼中，同樣是使用background-image加載兩張背景圖片，但是這次是使用background-clip屬性來實現(xiàn)切換。content-box表示只在元素內(nèi)繪制背景（不包括內(nèi)邊距），padding-box表示在內(nèi)容以及內(nèi)邊距區(qū)域之內(nèi)繪制背景，這樣就可以實現(xiàn)兩個背景圖片的切換效果。