<div class="nav">
<div class="nav2">
<SPAN class=leftTop></SPAN>
<SPAN class=rightTop></SPAN>
这里是主体内容....
<SPAN class=leftBottom></SPAN>
<SPAN class=rightBottom></SPAN>
</div>
</div>
CSS代码:
.nav{
position:relative;
width:500px;
margin:0px auto;
background:#eeeeee;
}
.nav2{
border:1px solid #dddddd;
padding: 4px 0px 2px 0px;
height:42px;
text-align:center;
}
/*css圆角处理*/
.nav .leftTop{/*css圆角左上角*/
background:url(images/wbb.gif) no-repeat left top;
width:10px;
height:10px;
position:absolute;
left:0;
top:0;
}
.nav .rightTop{/*css圆角右上角*/
background:url(images/wbb.gif) no-repeat right top;
width:10px;
height:10px;
position:absolute;
right:0;
top:0;
}
.nav .leftBottom{/*css圆角左下角*/
background:url(images/wbb.gif) no-repeat left bottom;
width:10px;
height:10px;
position:absolute;
left:0;
bottom:0;
}
.nav .rightBottom{/*css圆角右下角*/
background:url(images/wbb.gif) no-repeat right bottom;
width:10px;
height:10px;
position:absolute;
right:0;
bottom:0;
}
/*css圆角处理end*/
你所要做的就是准备一张画有圆的wbb.gif的图片而已。






