CSS 圆角 div

<style type="text/css">

<!--

.b1,.b2,.b3,.b4,.b5,.b6,.b7,.b8{height:1px; font-size:1px; overflow:hidden; display:block;}

.b1,.b8{margin:0 5px;}

.b2,.b7{margin:0 3px;border-right:2px solid #96C2F1; border-left:2px solid #96C2F1;}

.b3,.b6{margin:0 2px;border-right:1px solid #96C2F1; border-left:1px solid #96C2F1;}

.b4,.b5{margin:0 1px;border-right:1px solid #96C2F1; border-left:1px solid #96C2F1; height:2px ;}

.content {border-right:1px solid #96C2F1;border-left:1px solid #96C2F1;overflow:hidden; background-color: #FFFFFF;}

.color1 .b1,.color1 .b8{background:#96C2F1;}

.color1 .b2,.color1 .b3,.color1 .b4,.color1 .b5,

.color1 .b6,.color1 .b7,.color1 .content{background:#FFFFFF;}

-->

</style>

 

<div style="200px">

<div class="sharp color1">

<b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b> 

</div>

<div class="content">文字内容<br><br><br><br><br><br></div>

<div class="sharp color1">

<b class="b5"></b><b class="b6"></b><b class="b7"></b><b class="b8"></b>   

</div>

</div>