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

2025년 10월 4일 (토) 11:47 판

도움말

[ 펼치기 · 접기 ]

위키 문법
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] 셀에 적용했을 때

[1]

@@ 5번째 줄: / 5번째 줄: @@
 == 개념 ==
-=== CSS ===
+=== CSS 기초 2 ===
-여기서는 [[도움말:위키 문법|1장]] 서두의 HTML 태그와 CSS 부분을 정독하고 오셨다고 가정하고 설명합니다.
+여기서는 [[도움말:위키 문법|1장]] 서두의 HTML 태그와 CSS 기초 부분을 정독하고 오셨다고 가정하고 설명합니다.
 이전에 CSS 3개를 알려 드렸는데, 표에서 사용할 수 있는 3개의 태그를 더 소개하고자 합니다.
@@ 12번째 줄: / 12번째 줄: @@
 {| class="wikitable"
 |-
-! 속성 !! 설명 !! 예시 !! 출력<ref><code>span</code>에 적용했을 때</ref>
+! 속성 !! 설명 !! 예시 !! 출력<ref>셀에 적용했을 때</ref>
 |-
 | <code>text-align</code> || 좌우 정렬 || <code>text-align: right;</code>
@@ 24번째 줄: / 24번째 줄: @@
 |}
-== 행과 셀 ==
+== 표 ==
-=== 행 나누기 ===
+=== 표 만들기 ===
-행을 나누려면 <code>|-</code>을 사용합니다. 행마다 머리글이나 데이터를 넣을 수 있습니다.
+편집기 상단에 표 버튼을 통해 표를 만들 수도 있지만, 여기서는 수동으로 만드는 방법을 소개하고자 합니다. 먼저 표는 <code><nowiki>{|</nowiki></code>로 열고 <code><nowiki>|}</nowiki></code>로 닫습니다.
 {| class="wikitable"
 |-
-! 머리글1 !! 머리글2
+! style="max-width: 100px;" | 입력
-|-
+! 출력
-| 데이터1-1 || 데이터1-2
 |-
-| 데이터2-1 || 데이터2-2
+| style="padding-bottom: 0; padding-top: 15px;" | <pre>
+{|
 |}
+</pre>
-=== 셀 작성 ===
+|
-- 머리글 셀: <code>!</code>
+{|
-- 데이터 셀: <code>|</code>
-- 여러 개 셀 작성 시 한 행 안에서 |로 구분
-{| class="wikitable"
-|-
-! 머리글A !! 머리글B !! 머리글C
-|-
-| 데이터A1 || 데이터B1 || 데이터C1
-|-
-| 데이터A2 || 데이터B2 || 데이터C2
 |}
-=== 셀 병합 ===
-- **가로 병합**: <code>colspan="숫자"</code>
-- **세로 병합**: <code>rowspan="숫자"</code>
-{| class="wikitable"
-|-
-! colspan="2" | 병합된 머리글
-|-
-| 데이터1 || 데이터2
-|-
-| rowspan="2" | 세로병합 || 데이터3
-|-
-| 데이터4
-|}
-== 고급 기능 ==
-=== 정렬 ===
-셀 내부 내용을 정렬하려면 <code>style="text-align:left/right/center"</code>을 사용합니다.
-{| class="wikitable"
-|-
-! 왼쪽 !! 가운데 !! 오른쪽
-|-
-| style="text-align:left" | 왼쪽 정렬
-| style="text-align:center" | 가운데 정렬
-| style="text-align:right" | 오른쪽 정렬
-|}
-=== 배경색 ===
-각 셀에 배경색을 주어 강조할 수 있습니다.
-{| class="wikitable"
-|-
-! 제목1 !! 제목2
-|-
-| style="background:#ffcccc" | 빨강 배경
-| style="background:#ccffcc" | 초록 배경
 |}