라운드 코너를 구현하는 7줄의 css 코드

Cool technique ~~~

Just simple css code of 7 lines for Rounded corner : without any images

Css Code:

.rtop, .rbottom{display:block; }
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden}
.r1{margin: 0 5px; background:#9BD1FA;}
.r2{margin: 0 3px; background:#9BD1FA;}
.r3{margin: 0 2px; background:#9BD1FA;}
.r4{margin: 0 1px; height: 2px; background:#9BD1FA;}
.contain{background:#9BD1FA;text-align:center;}

HTML Code:

<div id="container" style="WIDTH: 100px">
<b class="rtop">
<b class="r1"></b>
<b class="r2"></b>
<b class="r3"></b>
<b class="r4"></b>
</b>
<div class="contain">Ashok Sudani</div>
<b class="rbottom">
<b class="r4"></b>
<b class="r3"></b>
<b class="r2"></b>
<b class="r1"></b>
</b>
</div>

- 출처: http://ashko.blogspot.com/2008/05/just-simple-css-code-of-7-lines-for.html