使用box-shadow屬性實現圓角效果代碼實例:通常實現圓角效果我們使用border-radius，其實我們也可以使用box-shadow屬性來實現。兩個屬性的具體用法這裡就不多介紹了，具體可以參閱以下兩個文章:（1）.圓角效果可以參閱CSS3實現圓角效果一章節。（2）.box-shadow可以參
使用box-shadow屬性實現圓角效果代碼實例:
通常實現圓角效果我們使用border-radius，其實我們也可以使用box-shadow屬性來實現。
兩個屬性的具體用法這裡就不多介紹了，具體可以參閱以下兩個文章:
（1）.圓角效果可以參閱CSS3實現圓角效果一章節。
（2）.box-shadow可以參閱CSS3的box-shadow屬性用法詳解一章節。
代碼實例:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> .antzone{ margin:100px; width:100px; height:100px; border-radius:1px; box-shadow:0 0 0 30px #cd0000; } </style> </head> <body> <div class="antzone"></div> </body> </html>
上面的代碼實現了我們的要求，下麵簡單做一下介紹。
設置元素的長寬均是100px，並且border-radius值是1px，也就是元素本身有一定的圓角效果，這當然是由用處的。
如果box-shadow的值是::0 0 0 0 #cd0000，那麼投影正好和元素重合的。
但是我們將擴展效果設置為30px，那麼就是向外擴展了30px，那麼圓角效果也就很明顯了。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=18266
更多內容可以參閱:http://www.softwhy.com/divcss/
