上次在blueidea上看到一个元素圆角的实现方法，但是那个太复杂了。于是就自己写了一个函数，可以将元素自动圆角。

演示地址：http://longbill.cn/down/sample/roundcorner.htm

不要用在有padding值得元素上，最好是在外面套一层。详情见演示地址。

代码：

functionRoundCorner(obj,style)

{

/********

网页元素圆角函数!!

作者:Longbill

主页:www.longbill.cn

********/

varr=[];

varstyles=[

{top:["05px","03px","02px","01px","01px"],bottom:["01px","01px","02px","03px","05px"]},

{top:["05px","03px","02px","01px","01px"],bottom:["0px","0px","0px","0px","0px"]},

{top:["0005px","0003px","0002px","0001px","0001px"],bottom:["0100px","0100px","0200px","0300px","0500px"]},

{top:["0500px","0300px","0200px","0100px","0100px"],bottom:["0001px","0001px","0002px","0003px","0005px"]}

];//author:longbill.cn

if(!style||style>styles.length)style=1;

style--;

varbtop=styles[style].top,bbottom=styles[style].bottom;

obj=document.getElementById(obj);

if(!obj)return;

varHTML=obj.innerHTML;

obj.innerHTML="";

for(varistop=1;istop>=0;istop--)

{

vartopborder=document.createElement("b");

topborder.style.display="block";

topborder.style.height="2px";

topborder.style.backgroundColor=(obj.parentNode.style.backgroundColor)?obj.parentNode.style.backgroundColor:"#FFFFFF";

for(vari=0;i<btop.length;i++)

{

varb=document.createElement("b");

if(obj.style.backgroundColor)

b.style.backgroundColor=obj.style.backgroundColor;

elseif(obj.className)

b.className=obj.className;

b.style.display="block";

b.style.margin=(istop)?btop[i]:bbottom[i];

b.style.height="1px";

b.style.overflow="hidden";

b.style.width="auto";

topborder.appendChild(b);

}

obj.appendChild(topborder);

if(istop)obj.innerHTML+=HTML;

}

}