[CSS]박스_레이아웃 속성 : table

 

표의 칸 하나하나 cell이라고 한다.

 

박스 영역	<table>, <th>, <td>
박스 영역 x	<tr>

박스 영역을 가지는 셀은 박스 속성을 지정할 수 있다. border 등등

 

1. <table> 태그에 적용할 수 있는 속성

-제목 위치

tag {caption-side: top;} /*제목 위치를 위쪽에*/
tag {caption-side: bottom;} /*제목 위치를 아래쪽에*/

 

-인접한 표 칸의 테두리 간격을 지정

tag { border-spacing :10px;} /*상하좌우*/
tag { border-spacing :10px 25px;} /*좌우 상하*/

 

-빈 셀 표시 여부

tag {empty-cells:show;} /*빈 셀 보이게*/
tag {empty-cells:hide;} /*빈 셀 안 보이게*/

 

-이중선 표시하지 않기

table, th, td 전부 경계선을 가지고 있기 때문에

border 속성을 줬을때 이중선으로 나타나지 않도록 속성 설정

tag { border-collapse:collapse;} /* 이중선 표현 x */
tag { border-collapse:separate;} /* 이중선 표현 o */