도움말:위키 문법 2장 「표」
분류: 도움말
| 도움말 | ||||
|---|---|---|---|---|
[ 펼치기 · 접기 ]
|
| 위키 문법 | ||
|---|---|---|
| 1장 「기초」 | 2장 「표」 | 3장 「HTML」 |
| 4장 「스타일링」 | 5장 「응용」 | |
| 개별 기능 | ||
| 보일 제목 | 틀 제작 | 파일 삽입 |
개념
CSS 기초 2
여기서는 1장 서두의 HTML 태그와 CSS 기초 부분을 정독하고 오셨다고 가정하고 설명합니다.
이전에 CSS 3개를 알려 드렸는데, 표에서 사용할 수 있는 3개의 태그를 더 소개하고자 합니다.
| 속성 | 설명 | 예시 | 출력[1] |
|---|---|---|---|
text-align |
좌우 정렬 | text-align: right;
|
예시 |
padding |
안쪽 여백 | padding: 0px;
|
예시 |
border |
테두리 | border: 2px blue solid;
|
예시 |
행과 셀
행 나누기
행을 나누려면 |-을 사용합니다. 행마다 머리글이나 데이터를 넣을 수 있습니다.
| 머리글1 | 머리글2 |
|---|---|
| 데이터1-1 | 데이터1-2 |
| 데이터2-1 | 데이터2-2 |
셀 작성
- 머리글 셀: !
- 데이터 셀: |
- 여러 개 셀 작성 시 한 행 안에서 |로 구분
| 머리글A | 머리글B | 머리글C |
|---|---|---|
| 데이터A1 | 데이터B1 | 데이터C1 |
| 데이터A2 | 데이터B2 | 데이터C2 |
셀 병합
- **가로 병합**: colspan="숫자"
- **세로 병합**: rowspan="숫자"
| 병합된 머리글 | |
|---|---|
| 데이터1 | 데이터2 |
| 세로병합 | 데이터3 |
| 데이터4 | |
고급 기능
정렬
셀 내부 내용을 정렬하려면 style="text-align:left/right/center"을 사용합니다.
| 왼쪽 | 가운데 | 오른쪽 |
|---|---|---|
| 왼쪽 정렬 | 가운데 정렬 | 오른쪽 정렬 |
배경색
각 셀에 배경색을 주어 강조할 수 있습니다.
| 제목1 | 제목2 |
|---|---|
| 빨강 배경 | 초록 배경 |
- ↑
span에 적용했을 때