도움말:위키 문법 1장 「기초」

분류: 도움말
도움말
[ 펼치기 · 접기 ]
위키 문법
1장 「기초」 2장 「표」 3장 「HTML」
4장 「스타일링」 5장 「응용」
개별 기능
보일 제목 틀 제작 파일 삽입
😣 내용이 너무 긴가요? 요약판이 있습니다.

개념

HTML 태그

HTML에 대한 심층적인 내용은 3장 「HTML」에서 다룹니다. 이곳에서는 뒤에 내용을 이해할 수 있도록 개념만 설명하고 있습니다.

HTML 태그는 글자를 둘러싸서 그 내용을 꾸미거나 역할을 부여하는 역할을 주로 합니다. HTML 태그는 <〇〇>으로 열고, </〇〇>으로 닫습니다.

대표적인 태그로는 span가 있는데, 이는 글자 자체를 선택하며, div는 안의 내용을 둘러싸는 상자를 만듭니다.

HTML 태그에는 속성attribute을 부여할 수 있습니다. 속성을 부여할 때는 여는 태그에 <〇〇 abc="123">과 같이 넣을 수 있고, 여러 개 넣을 때는 <〇〇 abc="123" def="456">처럼 쓰면 됩니다.

스타일링 기초 1

스타일링에 대한 심층적인 내용은 4장 「스타일링」에서 다룹니다.

스타일을 적용할 때 HTML 태그 중 여는 태그에 틀:스타일{{스타일|스타일 구문}}과 같이 사용합니다. 스타일 구문을 쓸 때는 속성-값 형태로 쓰며, 띄어쓰기로 구분합니다.

종합적으로 <span {{스타일|c-red bg-blue}}>파란 배경 빨간 글자</span>처럼 쓸 수 있습니다.

자세한 내용은 4장에서 소개할 것이니, 알고 있으면 좋은 서식 3개를 소개합니다.

서식 설명 예시 출력[1]
c 글자 색상 {{스타일|c-red}} 예시
bg 배경 색상 {{스타일|bg-#a0f0f0}} 예시
fs 글자 크기 {{스타일|fs-18px}} 예시

글자 서식

글꼴

현재 위키에서는 네 가지 글꼴을 제공하고 있습니다. 굵게와 기울이기는 각각 따옴표 3개와 2개로 입력할 수 있고, 밑줄과 취소선은 태그나 틀을 이용합니다.

입력 출력
'''굵게''' 굵게
<b>굵게</b>
''기울이기'' 기울이기
<i>기울이기</i>
<u>밑줄</u> 밑줄
{{--|취소선}} 취소선
<s>취소선</s>

색상

글자의 색을 바꾸기 위해서는 span 태그에 style 속성을 부여하고 그 안에 CSS로 color을 지정하면 됩니다. 예를 들어, <span style="color: red;">빨간 글자</span>와 같이 쓰면 됩니다.

그러나, 너무 코드가 길고 사용하기 어렵기 때문에 보통은 틀을 사용하여 간략하게 사용합니다. RGB 6자리 색상 코드나 CSS 색상 등을 사용할 수 있습니다.

입력 출력
{{색|red|빨강}} 빨강
{{색|#2a6db0|파랑}} 파랑

글씨 색상을 지정하면 다크 모드에서는 안 보이는 경우가 있습니다. 이때 ##색상처럼 # 대신 ##를 사용하면 됩니다. 여기서 색상 코드는 6자리 색상 코드만 가능합니다. 이 코드를 입력하면 다크 모드에서 적절한 색상으로 바꿔서 표시해줍니다.

입력 다크모드 출력
{{색|#000000|검정}}
{{색|#0000ff|파랑}}
검정
파랑
{{색|##000000}}|대응}}
{{색|##0000ff}}|대응}}
대응
대응

내용

목차

{{목차}} 틀은 오른쪽의 소개 표와 개요 문단 사이에 넣도록 되어 있는데, 다음 문단들이 틀 왼쪽에 붙지 않고 틀 밑으로 내려가도록 합니다. 그래서 목차 틀을 항상 넣는 것을 습관화하는 게 좋습니다.

문단

문단을 나누려면 줄을 두 번 띄우면 됩니다. 한 줄만 띄우면 줄바꿈은 되지 않고, 대신 같은 문단 안에서 연결됩니다.

문단 안에서 줄바꿈을 할 때는 br 태그를 열기만 하면 됩니다 (<br>). 두 방식은 행끼리 떨어지는 거리가 달라 서로 다른 용도로 사용합니다. 이때, 두 번 개행하는 방식을 표 안에 넣는 것은 권장되지 않습니다.

두 번 개행 br 태그 사용
동해 물과 백두산이
마르고 닳도록
동해 물과 백두산이
마르고 닳도록

목록

목록은 크게 번호 없는 목록과 번호 있는 목록으로 나뉩니다.

  • 별표(*)를 사용하면 번호 없는 목록이 됩니다.
    • 두 개 이상의 별표를 쓰면 들여쓰기가 됩니다.
  1. 샵(#)을 사용하면 번호 있는 목록이 됩니다.
    1. 역시 여러 개를 쓰면 들여쓰기가 됩니다.
  2. 번호는 자동으로 부여됩니다.

링크

내부 링크는 [[링크]]로 사용하면 됩니다. 이때, 링크되는 대상과 표시되는 내용을 다르게 하려면 [[링크|표시]]처럼 쓸 수 있습니다. 간혹 내부 링크에 색을 넣을 때 간결하게 {{색링크|링크|색상|표시}}를 사용해도 됩니다.

외부 링크는 [URL 제목]으로 씁니다. 파이프(|) 대신 그냥 띄어쓰기로 구분하며, URL에는 띄어쓰기가 없어야 하지만 제목에는 띄어쓰기가 있을 수 있음에 유의하세요.

나무위키 링크는 나무위키의 문서로 연결해주는데, 나무연결 틀을 {{나무연결|링크}} 또는 {{나무연결|링크|표시}}처럼 사용하면 됩니다.

입력 출력
[[제21대 대통령 선거]] 제21대 대통령 선거
[[제21대 대통령 선거|21대 대선]] 21대 대선
{{색링크|청광광역시|violet}} 청광광역시
{{색링크|청광광역시|violet|청광}} 청광
[https://youtube.com 유튜브] 유튜브
{{나무연결|경기외국어고등학교}} 경기외국어고등학교
{{나무연결|경기외국어고등학교|경기외고}} 경기외고

각주

각주를 사용하려면 ref 태그를 사용합니다. <ref>내용</ref>으로 사용하면 자동으로 사용된 순서대로 번호가 부여됩니다.[2]

틀을 만드는 것에 대해서는 틀 만들기 도움말을 별도로 두어 다룹니다.
주요 공용 틀의 약어는 도움말에서 볼 수 있습니다.

틀 문서에 있는 내용을 문서에 바로 삽입할 수 있습니다. 틀은 자주 사용되는 내용, 틀, 서식을 쉽게 쓸 수 있게 합니다.

'나무연결' 또한 틀의 하나로, 나무위키 링크의 긴 내용을 쉽게 사용할 수 있도록 압축한 것입니다.

{{〇〇|값|값|이름=값}}처럼 쓴다고 했을 때 〇〇는 틀의 이름이며, 그 뒤부터는 매개변수들입니다. 매개변수는 순서에 따라 자동으로 인식되도록 할 수도, 각각 이름이 있는 경우도 있는데, 전자의 경우 값만 쓰면 되고, 이름이 있는 경우에는 이름=값으로 입력합니다.

틀의 이름과 매개변수, 그리고 매개변수끼리 구분할 때는 파이프(|)를 사용하는데, 틀의 매개변수가 많아 헷갈릴 때는 각 파이프 문자가 나오기 전에 줄바꿈을 해도 됩니다.

공용으로 만들어진 틀의 경우, 각 틀을 어떻게 사용하는지는 주로 틀 문서에 기록되어 있습니다. 틀:이름을 검색해 확인해보세요.

  1. span에 적용했을 때
  2. 이와 같이 표시됩니다.