CurvyCorners
自从CSS3标准出来后，对于圆角的处理变得更简单了，仅仅用几行CSS代码就能实现圆角。但是，目前还有不少浏览器仍不支持CSS3标准，比如 IE6、7、8，那么我们是否能让IE也支持像CSS3那样的圆角呢？答案是当然可以的，用Javascript吧，这里我向大家推荐一个 Javascript圆角插件CurvyCorners。
如果用纯CSS3实现圆角，可以参考一下代码：
/*-moz-border-radius 是 Firefox 实现圆角的私有属性*/-moz-border-radius: 5px;/*-webkit-border-radius 是 webkit 内核浏览器（如 Safari 和 Chrome）实现圆角的私有属性*/-webkit-border-radius: 5px;
以上代码仅在支持CSS3的浏览器上才有圆角效果，下面是能兼容所有浏览器的圆角插件CurvyCorners的用法，让你的IE也支持CSS3圆角。
1、从CurvyCorners网站上下载源码：http://www.curvycorners.net/
2、在页面中引入CurvyCorners的js脚本：
<script type="text/javascript" src="curvycorners.js"></script>
3、给你需要实现圆角的元素（比如一个div）定义一个CSS样式，如：
.roundedCorners{width: 220px;padding: 10px;background-color: #DDEEF6;border:1px solid #DDEEF6; /* 支持CSS3的firefox或chrome就可以应用下面的圆角属性 */-webkit-border-radius: 6px;-moz-border-radius: 6px;}4、最后一步初始化一下：
addEvent(window, 'load', initCorners);function initCorners() { var setting = { tl: { radius: 6 }, tr: { radius: 6 }, bl: { radius: 6 }, br: { radius: 6 }, antiAlias: true } curvyCorners(setting, ".roundedCorners");}其中tl表示top-left，tr表示top-right，bl表示bottom-left，br表示bottom-right，这样解释你应该懂的。
这么一来，你的IE是不是就支持CSS3圆角了呢，兴奋一把吧。
原文来自：HTML5中文网站
TAG:
