도움말:위키 문법/표: 두 판 사이의 차이

2025년 10월 4일 (토) 10:38 판

도움말

[ 펼치기 · 접기 ]

위키 문법
1장 「기초」	2장 「표」	3장 「스타일링」
4장 「응용」
개별 기능
보일 제목	틀 제작	파일 삽입
내표

표

기본 구조

표는 {|로 시작해서 |}로 끝냅니다. 표의 각 줄은 |-으로 구분하고, 셀은 | 또는 !로 나눕니다. !는 제목 셀(굵은 글씨와 가운데 정렬)로 표시됩니다.

입력 출력

{| class="wikitable"
|-
! 제목1 !! 제목2
|-
| 내용1 || 내용2
|}

제목1	제목2
내용1	내용2

셀 구분

셀은 같은 줄에서 ||로 이어 쓰거나 줄을 바꾸고 앞에 |를 붙여서 씁니다. 제목 셀은 !! 또는 !로 구분합니다.

입력 출력

|-  
| 사과 || 배  
| 딸기 || 포도

사과	배	딸기	포도

행과 열 합치기

속성 rowspan과 colspan을 사용해 행과 열을 합칠 수 있습니다.

입력 출력

{| class="wikitable"
|-
! colspan="2" | 합쳐진 제목
|-
| 행1, 열1 || 행1, 열2
|-
| rowspan="2" | 두 줄 합침 || 행2, 열2
|-
| 행3, 열2
|}

합쳐진 제목
행1, 열1	행1, 열2
두 줄 합침	행2, 열2
두 줄 합침	행3, 열2

표 스타일

표에는 class="wikitable"을 주는 것이 기본입니다. 추가로 style 속성을 사용해 배경색, 정렬, 폭 등을 조정할 수 있습니다.

입력 출력

{| class="wikitable" style="text-align:center; width:50%;"
|-
! style="background:lightblue;" | 과일
! 색상
|-
| 사과 || 빨강
|-
| 포도 || 보라
|}

과일	색상
사과	빨강
포도	보라

틀을 이용한 표

복잡한 표를 매번 직접 쓰면 불편하기 때문에 자주 쓰는 표는 틀로 만들어 사용합니다. 예를 들어 {{정보상자}} 같은 표 형식의 틀을 이용하면 정리된 형식으로 자동 삽입됩니다.

@@ 3번째 줄: / 3번째 줄: @@
 {{도움말}}{{위키 문법}}
 {{목차}}
+== 표 ==
-== 개념 ==
+=== 기본 구조 ===
-표는 문서 안에서 데이터를 정리하거나 구조화할 때 사용합니다. 위키 문법에서 표는 HTML의 <code>table</code> 태그와 유사한 방식으로 작성합니다.
+표는 <code>{|</code>로 시작해서 <code>|}</code>로 끝냅니다.
-표 전체는 중괄호 두 개 <code>{|</code>와 <code>|}</code> 사이에 작성하며, 행과 셀을 지정하는 특별한 기호들을 사용합니다.
+표의 각 줄은 <code>|-</code>으로 구분하고, 셀은 <code>|</code> 또는 <code>!</code>로 나눕니다. <code>!</code>는 제목 셀(굵은 글씨와 가운데 정렬)로 표시됩니다.
 {| class="wikitable"
 |-
-! 기호 !! 의미
+! 입력 !! 출력
 |-
-| <code>{|</code> || 표 시작
+| <code><nowiki>{| class="wikitable"
 |-
-| <code>|-</code> || 새 행(row) 시작
+! 제목1 !! 제목2
 |-
-| <code>! ...</code> || 헤더 셀(th) (굵게, 가운데 정렬)
+| 내용1 || 내용2
+|}</nowiki></code>
+|
+{| class="wikitable"
 |-
-| <code>| ...</code> || 일반 셀(td)
+! 제목1 !! 제목2
 |-
-| <code>|}</code> || 표 끝
+| 내용1 || 내용2
 |}
+|}
+=== 셀 구분 ===
+셀은 같은 줄에서 <code>||</code>로 이어 쓰거나 줄을 바꾸고 앞에 <code>|</code>를 붙여서 씁니다.
+제목 셀은 <code>!!</code> 또는 <code>!</code>로 구분합니다.
-== 기본 사용 ==
 {| class="wikitable"
 |-
 ! 입력 !! 출력
 |-
-| <code><nowiki>{| class="wikitable"</nowiki></code><br>
+| <code><nowiki>|-
-  <code><nowiki>|-</nowiki></code><br>
+| 사과 || 배
-  <code><nowiki>! 제목1 !! 제목2</nowiki></code><br>
+| 딸기 || 포도</nowiki></code>
-  <code><nowiki>|-</nowiki></code><br>
-  <code><nowiki>| 내용1 || 내용2</nowiki></code><br>
-  <code><nowiki>|}</nowiki></code>
 |
 {| class="wikitable"
 |-
-! 제목1 !! 제목2
+| 사과 || 배
-|-
+| 딸기 || 포도
-| 내용1 || 내용2
 |}
 |}
-== 행과 셀 ==
+=== 행과 열 합치기 ===
-* 행 구분은 <code>|-</code>으로 합니다.
+속성 <code>rowspan</code>과 <code>colspan</code>을 사용해 행과 열을 합칠 수 있습니다.
-* 셀 구분은 같은 행 안에서 <code>||</code> 또는 <code>!!</code>으로 합니다.
-* 행의 첫 칸은 보통 <code>|</code> 또는 <code>!</code>로 시작합니다.
 {| class="wikitable"
 |-
-! 구분 !! 설명
+! 입력 !! 출력
 |-
-| <code>| 내용1 || 내용2</code> || 같은 행에 두 개의 일반 셀
+| <code><nowiki>{| class="wikitable"
 |-
-| <code>! 제목1 !! 제목2</code> || 같은 행에 두 개의 헤더 셀
+! colspan="2" | 합쳐진 제목
-|}
+|-
+| 행1, 열1 || 행1, 열2
-== 속성 ==
+|-
-표나 행, 셀에는 다양한 속성을 넣을 수 있습니다.
+| rowspan="2" | 두 줄 합침 || 행2, 열2
-예를 들어 <code>style</code> 속성을 이용하면 정렬이나 색상을 바꿀 수 있습니다.
+|-
+| 행3, 열2
+|}</nowiki></code>
+|
 {| class="wikitable"
 |-
-! 입력 !! 출력
+! colspan="2" | 합쳐진 제목
+|-
+| 행1, 열1 || 행1, 열2
 |-
-| <code><nowiki>| style="text-align:center;" | 가운데</nowiki></code> ||
+| rowspan="2" | 두 줄 합침 || 행2, 열2
-| style="text-align:center;" | 가운데
 |-
-| <code><nowiki>| style="background: #eef;" | 색상 배경</nowiki></code> ||
+| 행3, 열2
-| style="background: #eef;" | 색상 배경
+|}
 |}
-== 셀 합치기 ==
+=== 표 스타일 ===
-셀을 합치려면 <code>rowspan</code>이나 <code>colspan</code> 속성을 사용합니다.
+표에는 <code>class="wikitable"</code>을 주는 것이 기본입니다. 추가로 <code>style</code> 속성을 사용해 배경색, 정렬, 폭 등을 조정할 수 있습니다.
 {| class="wikitable"
@@ 79번째 줄: / 83번째 줄: @@
 ! 입력 !! 출력
 |-
-| <code><nowiki>{| class="wikitable"</nowiki></code><br>
+| <code><nowiki>{| class="wikitable" style="text-align:center; width:50%;"
-  <code><nowiki>|-</nowiki></code><br>
+|-
-  <code><nowiki>| 내용1 || 내용2 || 내용3</nowiki></code><br>
+! style="background:lightblue;" | 과일
-  <code><nowiki>|-</nowiki></code><br>
+! 색상
-  <code><nowiki>| colspan="2" | 가로 합치기 || 내용4</nowiki></code><br>
+|-
-  <code><nowiki>|-</nowiki></code><br>
+| 사과 || 빨강
-  <code><nowiki>| rowspan="2" | 세로 합치기 || 내용5 || 내용6</nowiki></code><br>
+|-
-  <code><nowiki>|-</nowiki></code><br>
+| 포도 || 보라
-  <code><nowiki>|| 내용7 || 내용8</nowiki></code><br>
+|}</nowiki></code>
-  <code><nowiki>|}</nowiki></code>
 |
-{| class="wikitable"
+{| class="wikitable" style="text-align:center; width:50%;"
-|-
-| 내용1 || 내용2 || 내용3
 |-
-| colspan="2" | 가로 합치기 || 내용4
+! style="background:lightblue;" | 과일
+! 색상
 |-
-| rowspan="2" | 세로 합치기 || 내용5 || 내용6
+| 사과 || 빨강
 |-
-| 내용7 || 내용8
+| 포도 || 보라
 |}
 |}
-== 정리 ==
+=== 틀을 이용한 표 ===
-* 표는 <code>{|</code>와 <code>|}</code> 사이에 작성한다.
+복잡한 표를 매번 직접 쓰면 불편하기 때문에 자주 쓰는 표는 틀로 만들어 사용합니다.
-* <code>|-</code>은 새 행을, <code>!</code>는 헤더 셀을, <code>|</code>는 일반 셀을 의미한다.
+예를 들어 <code><nowiki>{{정보상자}}</nowiki></code> 같은 표 형식의 틀을 이용하면 정리된 형식으로 자동 삽입됩니다.
-* <code>rowspan</code>, <code>colspan</code>으로 셀을 합칠 수 있다.
-* <code>style</code> 속성을 이용하면 색상, 정렬 등 다양한 꾸밈을 줄 수 있다.