CSS3中有一個(gè)很常用的屬性叫做border-radius，他可以用來實(shí)現(xiàn)元素的圓角。但是這個(gè)屬性只能實(shí)現(xiàn)4個(gè)角的圓角，要實(shí)現(xiàn)其中某幾個(gè)角的圓角比較困難，需要使用CSS3的另一個(gè)屬性border-image來實(shí)現(xiàn)。

在CSS3中，我們可以使用一個(gè)叫做CSS3 Multiple Backgrounds的技術(shù)來實(shí)現(xiàn)多重背景的效果。

.box {
background-image: url(background1.png),url(background2.png);
background-repeat: no-repeat,repeat;
background-position: top left,bottom right;
}

上面的代碼中，我們?cè)?box元素中設(shè)置了兩個(gè)背景圖像，第一個(gè)是background1.png，第二個(gè)是background2.png。我們通過background-repeat屬性來對(duì)兩個(gè)背景圖像做不同的處理，第一個(gè)圖像不重復(fù)，第二個(gè)圖像重復(fù)。最后通過background-position屬性來為兩個(gè)圖像分別設(shè)置不同的位置。

在CSS3中，我們還可以使用一些屬性來實(shí)現(xiàn)動(dòng)畫效果，比如transition、transform、animation等等。

.box {
transition: transform 1s;
}
.box:hover {
transform:rotate(360deg);
}

上面的代碼中，我們?cè)O(shè)置了一個(gè).box元素當(dāng)鼠標(biāo)移動(dòng)到上面時(shí)，通過transform屬性實(shí)現(xiàn)一個(gè)從0度到360度的旋轉(zhuǎn)效果，同時(shí)我們也設(shè)置了transition屬性來實(shí)現(xiàn)漸變效果。