用css实现圆角效果
经过最近一段时间的寻找和测试，我发现了用CSS实现圆角的三种方法：
第一种
CSS圆角效果，仅支持IE，不支持firefox
<style>
v\:*{behavior: url(#default#VML);}
</style>
<v:roundrect style="position: absolute; left: 20px; top: 50px; width: 200px; height: 140px" fillcolor="#e8e8e8" filled="T">
刷新本页才能看到效果</v:roundrect>
v\:*{behavior: url(#default#VML);}
</style>
<v:roundrect style="position: absolute; left: 20px; top: 50px; width: 200px; height: 140px" fillcolor="#e8e8e8" filled="T">
刷新本页才能看到效果</v:roundrect>
======================================
第二种
css圆角效果，IE6, firefox均显示正常
<title>css圆角效果--网站每日新</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<style type="text/css">
div.RoundedCorner{background: #9BD1FA}
b.rtop, b.rbottom{display:block;background: #FFF}
b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}
</style>
<p class="RoundedCorner">
无图片实现圆角框
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<style type="text/css">
div.RoundedCorner{background: #9BD1FA}
b.rtop, b.rbottom{display:block;background: #FFF}
b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}
</style>
<p class="RoundedCorner">
无图片实现圆角框
======================================
第三种
CSS圆角效果，支持firefox，不支持IE，这个比较简单，就一个属性，还是我的老板告诉我的，呵呵。
-moz-border-radius: 5px;
要说简单，当然是第三种，要说通用，那就是第二种，但是最复杂，第一种的通用性太差，仅支持IE，大家可以根据自己的情况选择不同的实现方法。
如果你觉得IE不好用（微软自己都承认IE的技术不如Firefox），你可以 ，来体验Firefox带给你的超爽感觉。
