HTML 테이블을 작업하다 보면 자주 혼동되는 두 가지 속성이 있습니다. 바로 셀 패딩(cellpadding)과 셀 간격(cellspacing)입니다. 이 글에서는 두 속성의 개념과 차이점을 명확하게 정리해 드립니다.
셀 패딩(Cellpadding)이란?
셀 패딩은 단일 셀 내부와 관련된 속성입니다. 주요 특징은 다음과 같습니다.
- 셀 테두리와 셀 안의 콘텐츠 사이에 있는 여백(공백)을 조절합니다.
- 기본값은 1입니다.
- 콘텐츠 주변에 적절한 여백을 만들어 가독성을 높이는 효과적인 방법으로 사용됩니다.
- HTML <table> 태그를 통해 생성할 수 있습니다.
- 속성 이름은 'cellpadding'으로 지정됩니다.
사용 예시
<table cellpadding="value">.....</table>
셀 간격(Cellspacing)이란?
셀 간격은 여러 셀 사이와 관련된 속성입니다. 주요 특징은 다음과 같습니다.
- 테이블에서 셀과 셀 사이의 간격을 설정합니다.
- 기본값은 2입니다.
- 셀 패딩에 비해 활용 빈도와 효율성이 떨어지는 편입니다.
- 마찬가지로 HTML <table> 태그를 통해 생성할 수 있습니다.
- 속성 이름은 'cellspacing'으로 지정됩니다.
사용 예시
<table cellspacing="value">.....</table>
핵심 차이점 요약
- 적용 대상: 셀 패딩은 하나의 셀 내부 여백에, 셀 간격은 셀과 셀 사이의 거리에 적용됩니다.
- 기본값: 셀 패딩은 1, 셀 간격은 2입니다.
- 활용도: 셀 패딩이 더 효과적인 방법으로 평가됩니다.
참고: 최신 웹 개발에서의 대안
두 속성 모두 HTML5에서는 더 이상 권장되지 않습니다(deprecated). 최신 웹 개발에서는 CSS를 사용하는 것이 좋습니다. 셀 내부 여백은 padding 속성으로, 셀 사이 간격은 border-spacing 속성으로 동일한 효과를 낼 수 있습니다.