楼主连概念都没有搞清楚吧。圆角矩形和ajax有关吗?<html>
<head>
<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>
</head>
<body>
<div class="RoundedCorner">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<br>无图片实现圆角框<br><br>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</body>
</html>
<head>
<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>
</head>
<body>
<div class="RoundedCorner">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<br>无图片实现圆角框<br><br>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</body>
</html>
div.RoundedCorner{
background: #9BD1FA;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomleft:10px;
}
</style>
</head>
<body>
<div class="RoundedCorner">
test
<br/>圆角矩形,遗憾的是只有Firefox支持</div>
<head>
<title>RoundedBoard</title>
<style>.RoundedBoard .b1 { HEIGHT: 1px; DISPLAY: block; OVERFLOW: hidden; BACKGROUND-COLOR:#ccc;}
.RoundedBoard .b2 { HEIGHT: 1px; DISPLAY: block; OVERFLOW: hidden }
.RoundedBoard .b3 { HEIGHT: 1px; DISPLAY: block; OVERFLOW: hidden }
.RoundedBoard .b4 { HEIGHT: 2px; DISPLAY: block; OVERFLOW: hidden }.RoundedBoard .b2 , .b3 , .b4{ BORDER: #ccc 0px solid;}.RoundedBoard .b1 { MARGIN: 0px 4px;}
.RoundedBoard .b2 { MARGIN: 0px 2px; BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 2px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 2px }
.RoundedBoard .b3 { MARGIN: 0px 1px; BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 1px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 1px }
.RoundedBoard .b4 { MARGIN: 0px 0px; BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 1px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 1px }
.RoundedBoard .boxcontent {
DISPLAY: block;
BORDER-RIGHT: #ccc 1px solid;
BORDER-LEFT: #ccc 1px solid;
padding:0px 5px;
}</style>
</head>
<body>
<DIV class="RoundedBoard" style="width:300px">
<B class=b1></B>
<B class=b2></B>
<B class=b3></B>
<B class=b4></B>
<div class=boxcontent>
asdfas asfd asfd asfd asdf asdf asf asdf asdf as asdf sasdf asdf <br>asdf<br>asdf<br>asdf<br>asdf<br>
</div>
<B class=b4></B>
<B class=b3></B>
<B class=b2></B>
<B class=b1></B>
</DIV>
</body>
</html>
<html>
<head>
<title>css圆角效果</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<script type="text/javascript" src="../TimeoutHandler/TimeoutHandler.js"></script>
<script type="text/javascript" src="../DebugPanel/DebugPanel.js"></script>
<script type="text/javascript"> function turnToRoundCorner(id, bgColor, conerColor) { var roundheader = "<div style=\"display:block;background-color:";
roundheader += conerColor + ";\"><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundheader += bgColor + ";margin:0 5px;\"></div><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundheader += bgColor + ";margin:0 3px;\"></div><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundheader += bgColor + ";margin:0 2px;\"></div><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundheader += bgColor + ";margin:0 1px;height:2px;\"></div></div>";
var roundfooter = "<br/><div style=\"display:block;background:";
roundfooter += conerColor + ";\"><div style\"display:block;height:1px;overflow:hidden;background-color:"
roundfooter += bgColor + ";margin:0 1px;height:2px;\"></div><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundfooter += bgColor + ";margin:0 2px;\"></div><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundfooter += bgColor + ";margin:0 3px;\"></div><div style=\"display:block;height:1px;overflow:hidden;background-color:"
roundfooter += bgColor + ";margin:0 5px;\"></div></div>"; var elem = document.getElementById(id);
elem.innerHTML = roundheader + elem.innerHTML + roundfooter;
elem.style.backgroundColor = bgColor;
}
</script>
</head><body onload="turnToRoundCorner('div1', '#9BD1FA', '#FFFFFF')">
<div id="div1">
<br/>无图片实现圆角框<br/>
</div>
</body>
</html>