Div+Css一个简略圆角效果 _HTML/CSS

Div+Css一个简单圆角效果
<html>
<head>
<title>css圆角效果</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<style type="text/css">
	div.RoundedCorner{background: #78ACFF}
	b.rtop, b.rbottom{display:block;background: #FFFFFF}
	b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #78ACFF}
	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">
	<!-- top -->
	<b class="rtop">
		<b class="r1"></b>
		<b class="r2"></b>
		<b class="r3"></b>
		<b class="r4"></b>
	</b>
	
	<!-- center -->
	<p><center>中间内容(无图片实现圆角框)</center></p>
	
	<!-- bottom -->
	<b class="rbottom">
		<b class="r4"></b>
		<b class="r3"></b>
		<b class="r2"></b>
		<b class="r1"></b>
	</b>
</div>
</body>
</html>