본문 바로가기
웹코딩 배우기/· CSS

CSS table

by 닐기 2019. 11. 12.

 

테이블을 쓰는 방법은 html의 table를 참고하자.

 

2019/09/12 - [웹코딩 어려워/· 사전 상세 보기] - HTML 태그 : table

2019/10/15 - [웹코딩 어려워/· HTML] - HTML 테이블

 

css에서 배울 테이블 태그는 테두리와 꾸미기.

 

▲ 테두리 합치기 CSS.

border-collapse: collapse;

 

- 테이블 너비 높이.

table: {table {width: px; height: px;}
table {width: %; height: %;}

 

- 테이블 내용 가로 정렬

text-aline: left; / right; / center;

- 테이블 내용 세로 정렬

vertical-aline: top; / middle; / bottom;

 

▲ 테두리 아래만 나오기. 마우스 가져가면 색 변하기.

 

nth-child(even) {background-color: tomato;} / even 홀수

nth-child(odd) {background-color: tomato;} / odd 짝수