테이블 태그의 td 태그, 테두리 간격을 조절하는 border-spacing

border-spacing 속성

테이블 태그를 사용해 표를 만들시 td태그간의 간격을 조절할때 필요로하는 css속성인 border-spacing은 셀 사이, 즉 테두리간 간격을 원하는 수치로 조절 할 수 있는 속성으로 테이블 간격 조절시 margin 또는 left,right 속성을 이용하지 않아도 간단히 수정이 된다는 장점이 있는 속성입니다

border-spacing 속성의 예제코드

<style type="text/css"> table { border-spacing: 10px; } table td { width: 30px; background: #ccc; } </style>

<table> <tr> <td>1번<td> <td>2번<td> <td>3번<td> </tr> </style>

여기서 테두리 간격을 조절하고 싶으면 border-spacing의 간격을 10px에서 0px로 변경하면 간격이 없어지게 되고

20px로 변경하면 간격이 더 늘어나는 효과를 얻을 수 있다.