[CSS 강좌] 테이블 꾸미기
표와 관련된 정렬 표와 관련된 정렬에는
•표 정렬
•셀 안의 내용 가로 정렬
•셀 안의 내용 세로 정렬이 있습니다.
기본 모양은
•표 : 왼쪽 정렬
•제목 셀(th) 안의 내용 가로 정렬 : 가운데 정렬
•내용 셀(td) 안의 내용 세로 정렬 : 왼쪽 정렬
•셀 안의 내용 세로 정렬 : 가운데 정렬입니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>CSS</title>
<style>
table, th, td {
border: 1px solid #bcbcbc;
}
table {
width: 400px;
height: 200px;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>서울특별시</th>
<th>대전시</th>
<th>부산시</th>
</tr>
</thead>
<tbody>
<tr>
<td>서울특별시</td>
<td>대전시</td>
<td>부산시</td>
</tr>
<tr>
<td>서울특별시</td>
<td>대전시</td>
<td>부산시</td>
</tr>
</tbody>
</table>
</body>
</html>
위코드의 결과물
'홈페이지제작 > CSS' 카테고리의 다른 글
| [CSS 강좌] CSS Margin 속성 (0) | 2018.03.05 |
|---|---|
| [ CSS 기초] css padding 속성 (0) | 2018.03.05 |
| [CSS 강좌] 박스 모델(Box Model) (0) | 2018.02.07 |
| [HTML과 CSS 코드예시] 스타일 적용으로 웹페이지 꾸미기 (0) | 2018.02.06 |
| CSS 강좌 /선택자 / 전체 선택자(Universal Selector) (0) | 2018.02.05 |
itworldkorea
IT korea가 세상(world)을 변화시킨다.