Border-Collapse
개요 : 이 속성은 테이블 셀(cell) 요소의 테두리 겹침을 지정한다.
정의
|
border-collapse |
설명 |
|
값 |
collapse | separate | inherit |
|
기본값 |
collapse |
|
적용대상 |
테이블(table) 요소와 인라인 테이블(inline table)요소 |
|
상속 |
됨 |
|
백분율 |
사용 불가 |
|
미디어 |
visual |
값
|
값 |
설명 |
|
collapse |
겹치도록 지정한다. |
|
separate |
분리되도록 지정한다. |
|
inherit |
부모 요소의 값을 상속하도록 지정한다. |
View Source :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>
<style type="text/css">
table {
border-collapse: collapse;
border: 1px solid black;
}
th, td {
border: 1px dotted gray;
}
</style>
<body>
<caption>
<strong>border-collapse</strong>컬럼들 좌우 및 상하 테두리 합치기(간격 없애기), <a target="_blank" href="http://hooney.net/docs/css/Border-spacing">border-spacing</a>와 비교 참조
</caption>
<table>
<tr>
<th>컬럼들 좌우 간격</th>
<td>0</td>
<td>px</td>
</tr>
<tr>
<th>컬럼들 상하 간격</th>
<td>0</td>
<td>px</td>
</tr>
</table>
</body>
Result :
''.' Programs > CSS' 카테고리의 다른 글
| List - Style (0) | 2012.03.20 |
|---|---|
| Table - Layout (0) | 2012.03.20 |
| Border - Spacing (0) | 2012.03.20 |
| Empty - Cells (0) | 2012.03.20 |
| Caption-Side (0) | 2012.03.20 |