在CSS 2的時代，我們如果要讓圖片、div標籤擁有圓角效果其實是蠻麻煩的，簡單點的用法是套用jQuery裡面別人幫你寫好的Function，如果喜歡自己搞的話，就必須要設計圓角圖，然後讓圓角圖去重疊，反正就是很複雜就對了，但是在CSS 3裡面，你不在需要用那麼麻煩的東西，直接在CSS語法裡面設定就可以了！
註：使用此功能，需要瀏覽器支援CSS 3，例如：IE 9、Firefox 4、Chrome、Safari等等新的瀏覽器
語法：
border-radius:圓角程度; //這是指左上、左下、右上、右下的四個角都用成圓角
圓角程度的那裡可以填入各種單位，例如px、cm都是有效果的
範例：
建立一個id=ex的div標籤，然後將他的style設定為：
#ex{
width:200px; //設定方塊的寬度
eight:200px; //設定方塊的高度
margin:0px auto; //將方塊置中，與圓角效果無關
border:1px solid #000; //設定邊框方便識別圓角
border-radius: 10pt; //設定10pt的圓角效果
}
我在網路上有看到說可以針對左上或左下或右上或右下的某一個角做圓角，但是實際測試發現好像都不能達到效果，另外網路上很多文章是說要加上moz-或webkit-的前墜才能在Firefox、Chrome、Safari上達到圓角效果，但根據我的測試，目前最新版的瀏覽器都已經不需要加上前墜了，因為border-redius已經是CSS 3的標準格式囉～ 加上前墜(moz-、webkit-)就沒有那麼需要了，除非你很在乎向下相容啦xD