隨著CSS3的問(wèn)世和普及，許許多多需要采用JS才能實(shí)現(xiàn)的網(wǎng)頁(yè)視覺(jué)效果用CSS3即可輕易實(shí)現(xiàn)，許多需要用圖片才能表達(dá)的東西用CSS3就可以，例如我們常用的圓角樣式。在此之前，要實(shí)現(xiàn)圓角，必須借助圖片或其它插件，現(xiàn)在，一切變得非常簡(jiǎn)單了，只需要加短短的幾句CSS3代碼就可以了。
CSS3代碼： border-radius:5px; -moz-border-radius:5px;
使用上面的CSS3樣式就可以實(shí)現(xiàn)上圖所示的圓角效果
CSS3甚至允許你設(shè)置每一個(gè)角的樣式，例如如下代碼。
/*左上角*/
border-top-left-radius:5px; -webkit-border-top-left-radius:5px;
/*右上角*/
border-top-right-radius:5px; -webkit-border-top-right-radius:5px;
/*左下角*/
border-bottom-left-radius:5px; -webkit-border-bottom-left-radius:5px;
/*右下角*/
border-bottom-right-radius:5px; -webkit-border-bottom-right-radius:5px;
怎么樣，很容易實(shí)現(xiàn)吧CSS3圓角吧？其最大的好處在于，不用再為一些圓角的網(wǎng)頁(yè)元素而去用Photoshop畫圖了。更好的地方是，由于用CSS代替圖片，可以大大減少網(wǎng)頁(yè)加載量，提高網(wǎng)頁(yè)打開(kāi)速度哦。
