CSS 참조 가이드

CSS @규칙(RULES)

border-collapse CSS 속성은 테이블 셀 경계선이 하나의 경계선으로 축소되거나 일반적으로 분리되는지 지정합니다.

CSS 테이블 셀에 경계선을 설정할 수 있는 두 가지 다른 모델이 있습니다.

이 모델에서는, 각 테이블 셀에 독립적인 경계선이 있습니다.

border-spacing속성이 주어진 인접 셀 경계선 간의 거리.

주의:分隔 경계선 모델에서는, 셀(그리고 테이블 자체)만 경계선을 가질 수 있습니다; 행, 열, 행 그룹, 열 그룹은 아니요.

折叠边框 모델에서는, 인접한 테이블 셀이 경계선을 공유합니다.

주의:折叠边框 모델에서는, 주변 셀, 행, 행 그룹, 열, 열 그룹의 전체 또는 일부를 가지고 있는 경계선을 지정할 수 있습니다.

border-collapse 속성은 테이블의 테두리 모델을 선택합니다. 값 separate는 구분된 테두리 모델을 선택합니다. 값 collapse는 취합된 테두리 모델을 선택합니다。

아래 표는 이 속성의 사용 설명과 버전 기록, 그리고 JavaScript 스크립트에서 이 속성을 사용하는 문법을 설명합니다。

기본 값:	분리
적용:	이표와 직접 목록 요소
thừa kế:	네
애니메이션 가능:	아니요。참조: 애니메이션 속성。
버전:	CSS 2、3
JavaScript 문법:	object object.style.borderCollapse="collapse"

이 속성의 문법은 다음과 같습니다:

border-collapse: separate | collapse | initial | inherit

아래 예제는 border를 사용하는 방법을 보여줍니다-collapse 속성

예제

　　table {
　　　border-collapse: collapse;
　　}
　　th, td {
　　　border:　1px solid black;
　　}

아래 표는 이 속성의 값을 설명합니다。

값	설명
separate	구분된 테이블 모델 선택. 기본 값입니다。
collapse	취합된 테이블 모델 선택border-spacing와empty-cells속성은 무시됩니다。
initial	이 속성을 기본 값으로 설정합니다。
inherit	지정된 경우, 관련 요소는 부모 요소의 border를 사용합니다-collapse 속성 값。

border-collapse 속성의 브라우저 호환성, 아래 표의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다; 모든 주요 브라우저는 이 속성을 지원합니다。

	Firefox 1+ Google Chrome1+ Internet Explorer 5+ Apple Safari 1.2+ Opera 4+

경고: 사용border-collapse속성을 사용할 때는 항상 유효한<!DOCTYPE>지나치게 할 수 있습니다。