테이블의 줄(row)과 칸(cell)의 태두리(border)가 단일 테두리로되는가 HTML 표준으로 되는가를 반환하거나 설정한다.

인수
cssSelector : (스타일 선택자)
속성을 가질수 있는 엘레멘트()나 클라스(class) 이름 혹은 인식자(id)이다.

: (속성 문자열)
스타일 속성은 개체의 테이블의 줄(row)과 칸(cell)의 태두리(border)가 붕괴되어 단일 테두리로되는가 HTML 표준으로 되는가를 나타내는 문자열이다.

separate 디폴트이며, 테두리가 표준 HTML 방식으로 표현된다.
collapse 인접 칸과 접속된 테두리가 붕괴되고 단일 테두리로 표현한다.

이 속성은 currentStyle에서는 읽기전용이고, 그외의 개체에서는 읽기/쓰기이며, 디폴트값은 separate이다.

CSS(Cascading Style Sheets) 애트리뷰트는 상속되지 않는다.

적용
개체scriptCSS IE 버전
참조
border

이 속성은 CSS2(Cascading Style Sheets Level 2)에 정의되었다.


적용 ObjectcurrentStyle
ObjectruntimeStyle
Objectstyle
ElementTABLE

tableObj.style.borderCollapse :

결과 표시창
<SCRIPT>
function showAll(){
  str='tableObj.style.borderCollapse=<FONT color=blue>'+tableObj.style.borderCollapse+'</FONT><BR>';
  str+='tableObj.currentStyle.borderWidth=<FONT color=blue>'+tableObj.currentStyle.borderWidth+'</FONT><BR>';
  str+='tableObj.currentStyle.borderStyle=<FONT color=blue>'+tableObj.currentStyle.borderStyle+'</FONT><BR>';
  str+='tableObj.currentStyle.borderColor=<FONT color=blue>'+tableObj.currentStyle.borderColor+'</FONT><BR>';
  str+='tableObj.currentStyle.width=<FONT color=blue>'+tableObj.currentStyle.width+'</FONT><BR>';
  str+='tableObj.currentStyle.height=<FONT color=blue>'+tableObj.currentStyle.height+'</FONT><BR>';
  showA.innerHTML=str;
}
</SCRIPT>
<TABLE id="tableObj" style="border-collapse:collapse" border="10" cellpadding="10" cellspacing="10" bgcolor="#ffffaa" width="400">
<COL><COL><COL style=background-color:ffe>
<TR><TD rowspan=4>적용</TD>
<TD>Object</TD><TD>currentStyle</TD></TR>
<TR><TD>Object</TD><TD>runtimeStyle</TD></TR>
<TR><TD>Object</TD><TD>style</TD></TR>
<TR><TD>Element</TD><TD>TABLE</TD></TR>
</TABLE>
<P>tableObj.style.borderCollapse :
<BUTTON onclick="tableObj.style.borderCollapse='separate';showAll()">separate</BUTTON>
<BUTTON onclick="tableObj.style.borderCollapse='collapse';showAll()">collapse</BUTTON>
<DIV id=showA>결과 표시창</DIV>