[css] css 둥근테두리만들기 > 팁앤테크

• 목록

• 페이스북 공유
• 트위터 공유
• 

<style type="text/css">
table.corner {
border-collapse:collapse;
background:#F9F9F9;
margin:0 0 10px 0;
}
.tl_gray{background: url(./img/tl.gif) no-repeat;width:5px;height:5px;}
.tr_gray{background: url(./img/tr.gif) no-repeat;width:5px;height:5px;}
.bl_gray{background: url(./img/bl.gif) no-repeat;width:5px;height:5px;}
.br_gray{background: url(./img/br.gif) no-repeat;width:5px;height:5px;}
</style>

<table width="100%" class="corner"><tbody>
<tr>

<td class="tl_gray"><br /></td>

<td><br /></td>

<td class="tr_gray"><br /></td></tr>
<tr>

<td><br /></td>

<td style="padding: 20px"> 내용
</td>

<td><br /></td></tr>
<tr>

<td class="bl_gray"><br /></td>

<td><br /></td>

<td class="br_gray"><br /></td></tr></tbody></table>


이미지는 가로세로10px원을 그린후 열십자 조각으로 사용한다.