목차
- caption-side 예제 - 테이블 표제 위치
- caption-side 정의
- caption-side 구문
caption-side 예제 - 테이블 표제 위치
<style>
table,th,td {border:1px solid silver; border-collapse:collapse;}
caption {caption-side:top;}
</style>
<table>
<caption>필수 코딩언어 (Homzzang.com)</caption>
<tr>
<th>HTML</th><th>CSS</th><th>JS</th>
</tr>
<tr>
<td>기본틀</td><td>디자인</td><td>기능동작</td>
</tr>
</table>
caption-side 정의
<table> 표제 위치 지정.
1.
테이블마다 표제위치 다르게 하려면, id나 class 선택자 이용.
2.
- 기본값: top
- 상속여부: O
- 애니효과: X
- CSS버전: CSS2
- JS구문: object.style.captionSide="bottom";
3.
IE8 이상 주요 최신브라우저 모두 지원.
단, IE8 경우 DTD 선언된 경우만 작동.
4. MDN caption-side 예제보기
caption-side 구문
selector { caption-side:top|bottom|initial|inherit; }
[속성값]
top
테이블 위에 배치.
bottom
테이블 아래에 배치.
initial
이 속성의 기본값으로 설정.
inherit
부모요소 속성값 상속.