(→특수명령어) |
(→고급틀 제작) |
||
| 345번째 줄: | 345번째 줄: | ||
=='''고급틀 제작'''== | =='''고급틀 제작'''== | ||
===변수의 이해=== | ===변수의 이해=== | ||
변수란 틀을 다른 문서에 끼워넣기 할 때 편집자가 변수에 해당하는 부분의 내용을 임의로 변경할 수 있는 값을 말합니다. 단순하게는 색을 바꾸는 정도에서, 테이블에 새로운 행을 추가하는 것도 가능합니다. | |||
당연히 변수로 지정되지 않은 부분의 내용은 끼워넣기 할 때 변경할 수 없습니다. | |||
===변수틀의 기초=== | ===변수틀의 기초=== | ||
틀을 제작할 때 변수는 기본적으로 중괄호 세 쌍({{폰트|monospace|<nowiki>{{{변수}}}</nowiki>}})으로 생성합니다. | |||
<nowiki>{{{1}}}</nowiki> 이것이 변수의 가장 기본적인 형태입니다. 이렇게 중괄호 세 쌍 안의 내용에는 변수의 '''이름''' 또는 '''순서'''가 들어가게 됩니다. 숫자를 입력하면 변수의 '''순서'''를 의미하고, 그외에 숫자가 아닌 문자열을 입력하면 변수의 '''이름'''을 의미합니다. | |||
또한 변수의 이름 또는 순서 뒤에 파이프 문자({{폰트|monospace|<nowiki>|</nowiki>}})를 넣고 그 뒤에 변수의 기본값을 입력할 수 있습니다. 이 기본값은 해당 변수가 끼워넣기에서 사용되지 않았을 때 기본으로 출력됩니다. 예를 들어 {{폰트|monospace|이 변수는 <nowiki>{{{1|기본}}}</nowiki>입니다.}}와 같은 내용의 틀에서 변수를 사용하지 않고 끼워넣기만 했다면 {{폰트|monospace|이 변수는 기본입니다.}}와 같이 출력될 것입니다. 만약 파이프 문자만 넣고 그 뒤에 내용을 넣지 않으면 변수의 기본값은 공백이 됩니다. | |||
변수는 틀을 끼워넣기 할 때 틀 이름 뒤에 파이프 문자를 넣음으로써 사용하게 되는데, 이때 순서로 입력된 변수는 단순히 변수에 들어갈 내용만을 순서에 맞게 작성하면 됩니다. 다만 이름으로 된 변수는 해당 변수의 이름을 선언한 뒤 등호({{폰트|monospace|<nowiki>=</nowiki>}})를 넣고 그 뒤에 변수에 들어갈 내용을 작성해야 합니다. 예를 들어 "abc"라는 제목의 틀 안에 있는 {{폰트|monospace|<nowiki>{{{이름변수}}}</nowiki>}}라는 변수를 사용하기 위해서는 {{폰트|monospace|<nowiki>{{abc|이름변수=변수 내용}}</nowiki>}}처럼 입력해야 합니다. | |||
순서로 입력된 변수도 순서에 해당하는 숫자를 변수 이름처럼 사용할 수 있습니다. 예를 들어 내가 두 번째 변수는 사용하고 싶은데 첫 번째 변수는 사용하고 싶지 않을 때, 변수 이름처럼 {{폰트|monospace|<nowiki>2=변수 내용</nowiki>}}과 같이 사용 가능합니다. | |||
이름 변수와 숫자 변수는 서로 영향을 주지 않습니다. 다시 말해, 이름이 있는 변수는 순서로 된 변수의 순서에 영향을 주지 않는다는 말입니다. {{폰트|monospace|<nowiki>{{abc|이름변수=변수 내용|첫 변수}}</nowiki>}}과 같이 입력하면 "첫 변수"는 <nowiki>{{{1}}}</nowiki>로 된 첫 번째 변수의 내용으로 입력됩니다. | |||
=='''각주'''== | =='''각주'''== | ||
2022년 10월 6일 (목) 06:33 판
 제이위키의 규정
|
| 기본방침 (문서 관리 방침 · 토론 관리 방침 · 이용자 관리 방침 · 운영 관리 방침) · 편집지침 · 커뮤니티 가이드라인 · 동음이의 리다이렉트 요청 |
| 제이위키의 도움말
|
| FAQ · 도움말 (사이트 소개 · 저작권 · 운영진 · 단축키 · 편집 · 문법 (표 · HTML · CSS) · 틀 · 분류 · 등급 (등급 목록) · 동음이의) · 유저가이드 (기초문법 · 고급문법 · 정치 창작 팁 · 전쟁 창작 팁 · 판타지 창작 팁 · 언어 창작 팁 · 종교 창작 팁) · 권리침해 · 다른 위키와의 차이점 |
| 제이위키의 운영
|
| 운영진 (관리자 · 중재자) · 관리자 선거 (2018 · 2019 · 2021) · 투명성 보고서 · 재정 보고서 |
| 제이위키의 인정단체
|
| 인정단체 · 에른스트의 아무튼 공방 (아무거나 월간공방) · 그리다 · 감성위키 · 와르샤와웍스 · 연필이 닿는 곳 · 철통팀 · 오펜시브 프로젝트 팀 |
| 제이위키의 앙케이트
|
| 이 창작이 대단하다! (2021 세계관 · 2021 창작자 · 2020 세계관 · 2020 창작자 · 2020 편의성) · 연말시리즈 (2022 · 2023) |
| 제이위키 유저가이드 JWIKI USER GUIDE | ||
[ 기초 문법 ]
[ 고급 문법 ]
[ 주제별 팁 ]
| ||
| 본 템플릿(틀)은 의 유저가이드에 관한 것으로, '에른스트의 아무튼 공방'의 일부임을 밝힙니다. '주제별 팁'을 신청하시려면 토론으로 남겨주세요. 신청자는 그 주제에 대한 팁을 마음껏 작성하실 수 있습니다. | ||
개별속성
속성 설정하기
Style에 사용되는 속성은 모두 HTML과 CSS에서 파생된 것입니다. 따라서 각종 검색엔진을 통해 HTML, CSS 속성 위주로 탐색할 수 있습니다. 아래의 속성 유형도 검색을 통해 다양한 기능을 추가로 살펴볼 수 있습니다. 나아가 인터넷을 통해 원하는 설정의 속성을 찾을 수 있을 것입니다.
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| color | <span style="color:orange;"> 오렌지 </span> | 오렌지 | 글자색을 설정합니다. |
| style="…… color:[색상]; ……" | |||
| background-color | <span style="background-color:orange;"> 오렌지 </span> | 오렌지 | 배경색을 설정합니다. |
| style="…… background-color:[색상]; ……" | |||
| ↓ background-image | |||
| linear-gradient | <span style="background-image:linear-gradient(to right, #000, yellow, #fff);"> 그라데이션 </span>
|
선형 그라데이션 | 선형 그라데이션을 설정합니다. |
| style="…… background-image:linear-gradient([방향 or 각도], [색상1] [색상1 위치], [색상2] [색상2 위치], ……); ……" | |||
| linear-gradient [방향] | <span style="background-image:linear-gradient(to top, #000, #fff);"> 그라데이션 방향 </span>
|
그라데이션 방향 | 그라데이션 방향을 지정합니다.[1] |
| linear-gradient [각도] | <span style="background-image:linear-gradient(45deg, #000, #fff);"> 그라데이션 각도 </span>
|
그라데이션 각도 | 그라데이션 각도를 지정합니다. |
| linear-gradient [위치] | <span style="background-image:linear-gradient(to right, gray 50%, gold 80%);"> 그라데이션 위치 </span>
|
그라데이션 위치 | 색상 위치를 지정합니다. |
| repeating-linear-gradient | <span style="background-image:repeating-linear-gradient(45deg, #1f719a 6%, #1f719a 12%, #2abdc3 12%, #2abdc3 18%, #fff6ee 18%, #fff6ee 24%);"> 반복 그라데이션 </span>
|
반복 그라데이션 | 그라데이션을 반복합니다. |
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| text-align | {| style="text-align:right;" | 오른쪽 |} |
오른쪽 | 글자정렬을 설정합니다. |
| style="…… text-align:[위치]; ……" | |||
| align | (추가 바람) | (추가 바람) | 표 좌우정렬을 설정합니다. |
| style="…… align:[위치]; ……" | |||
| vertical-align | {| | style="vertical-align:bottom;" | [[파일:에른 귀찮음.png|50px]] |} |
|
표 상하정렬을 설정합니다. |
| style="…… vertical-align:[위치]; ……" | |||
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| font-size | <span style="font-size:15pt;"> 15pt </span> | 15pt | 글자크기을 설정합니다. |
| style="…… font-size:[크기]; ……" | |||
| width | {| style="width:80px;" | ~ | 표와 칸의 폭을 설정합니다. | |
| style="…… width:[크기]; ……" | |||
| height | {| style="height:3em;" | ~ | 표와 칸의 높이를 설정합니다. | |
| style="…… height:[크기]; ……" | |||
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| border | <span style="border: 1px solid orange;"> orange </span> | orange | 글자나 표의 테두리를 설정합니다. |
| <span style="border: 1px dashed orange;"> dashed </span> | dashed | ||
| style="…… border:[두케] [모양][2] [색상]; ……" | |||
| border-radius | <span style="border: 1px solid orange; border-radius:20%;"> 둥근상자 </span> |
둥근상자 | 모서리의 둥글게 설정합니다. |
| style="…… border-radius:[크기]; ……" | |||
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| opacity | <span style="opacity:0.5"> 50% </span> | 50% | 투명도를 설정합니다. |
| style="…… opacity:[크기]; ……" 투명도 값은 0(투명) ~ 1(완전 불투명) 사이 값으로 결정됩니다. | |||
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| padding | (추가 바람) | (추가 바람) | 칸 내부의 여백를 설정합니다.[3][4] |
| style="…… padding:[크기]; ……" | |||
| margin | (추가 바람) | (추가 바람) | 칸 외부의 여백를 설정합니다.[5][6] |
| style="…… margin:[크기]; ……" | |||
| letter-spacing | <span style="letter-spacing:5pt"> 5pt </span> | 5pt | 자간을 설정합니다. |
| style="…… letter-spacing:[크기]; ……" | |||
| line-height | <span style="line-height:250%"> 250<br/>% </span> | 250 % |
행간을 설정합니다. |
| style="…… line-height:[크기]; ……" | |||
| 속성 명칭 | 입력한 내용 | 화면에 표시되는 내용 | 텍스트 설명 |
|---|---|---|---|
| overflow | (추가 바람) | (추가 바람) | 스크롤바를 설정합니다. |
| style="…… overflow:[속성]; ……" 속성 값) hidden: 숨김 / auto: 지정된 width, height 값을 넘길 때 생성 / scroll: 항상 보임 | |||
속성 설정값 알기
div와 span
특수명령어
위키 문법의 특수 명령어는 틀 끼워넣기와 같이 중괄호 두 쌍({{}})으로 사용합니다. 다만 명렁어의 이름이 샵(#)과 함께 맨앞에 부여되어야 합니다.
expr 함수
expr은 간단한 계산을 할 수 있는 함수로, 다음과 같이 사용합니다.
{{ #expr : 계산식 }}
| 연산자 | 기능 | 예제 |
|---|---|---|
| - | {{#expr: 123456789012345}} = 1.2345678901234E+14 | |
| {{#expr: 0.000001}} = 1.0E-6 | ||
| ( ) | 괄호 | {{#expr: (30 + 7) * 7 }} = 259 |
| + | 양수 부호 | {{#expr: +30 * +7}} = 210
|
| - | 음수 부호 | {{#expr: -30 * -7}} = 210
|
| not | 부정문 | {{#expr: not 0 * 7}} = 7 {{#expr: not 30+7}} = 7 |
| * | 곱셈 | {{#expr: 30 * 7}} = 210 |
| / | 나눗셈 | {{#expr: 30 / 7}} = 4.2857142857143 |
| div | 나눗셈. /과 같음 | {{#expr: 30 div 7}} = 4.2857142857143 {{#expr: 5 div 2 * 2 + 5 mod 2}} = 6 |
| mod | 정수 나눗셈을 한 나머지를 구합니다.
주의: 다른 프로그래밍 언어와 작동 방식이 다릅니다. |
{{#expr: 30 mod 7}} = 2 {{#expr: -8 mod -3}} = -2{{#expr: -8 mod +3}} = -2{{#expr: 8 mod 2.7}} = 0 {{#expr: 8 mod 3.2}} = 2 {{#expr: 8.9 mod 3}} = 2 |
+
|
덧셈 | {{#expr: 30 + 7}} = 37
|
-
|
뺄셈 | {{#expr: 30 - 7}} = 23
|
| round | 반올림 계산을 합니다. | {{#expr: 30 / 7 round 3}} = 4.286 {{#expr: 30 / 7 round 0}} = 4 {{#expr: 3456 round -2}} = 3500 |
| = | 등호 | {{#expr: 30 = 7}} = 0 |
| <> | 부등호. 다를 경우에 true=1, 같을 경우에 false=0이 나옵니다. | {{#expr: 30 <> 7}} = 1 |
| != | 부등호. <>와 같습니다. | {{#expr: 1 != 0}} = 1 |
| < | 작다 | {{#expr: 30 < 7}} = 0 |
| > | 크다 | {{#expr: 30 > 7}} = 1 |
| <= | 작거나 같다 | {{#expr: 30 <= 7}} = 0 |
| >= | 크거나 같다 | {{#expr: 30 >= 7}} = 1 |
| and | Logical AND | {{#expr: 4<5 and 4 mod 2}} = 0 |
| or | Logical OR | {{#expr: 4<5 or 4 mod 2}} = 1 |
if 함수
if는 논리 연산자에서 if-then-else에 해당하는 함수입니다. 다음과 같이 사용합니다.
{{ #if : [조건 문자열] | [조건이 참이면 출력될 문장] | [조건이 거짓이면 출력될 문장] }}
조건 문자열의 참/거짓 판단은 조건 문자열이 비어 있으냐입니다. 즉, 조건 문자열이 비어 있지 않을 때 참, 조건 문자열이 비어 있을 때 거짓으로 인식합니다.
조건이 거짓일 때 출력될 문장은 생략할 수 있습니다. 이때는 조건이 거짓일 때 빈 문장으로만 출력됩니다.
ifeq 함수
두 문자열을 비교하여 같은지 다른지를 판단하는 함수입니다.
{{ #ifeq : [문자열 1] | [문자열 2] | 같을 경우 | 다를 경우 }}
ifexist 함수
{{ #ifexist : 문서 이름 | 문서가 있을 때 | 문서가 없을 때 }}
switch 함수
어떤 값에 대하여 함수에 지정된 특정한 값과 동일하면 이에 대응하는 결과값을 출력하는 함수입니다. 다음과 같이 사용합니다.
{{ #switch : [비교할 값]
| [값 1] = [결과 1]
| [값 2] = [결과 2]
| ...
| [값 n] = [결과 n]
| 기본값 }}
즉, [비교할 값]이 [값 1]과 같으면 그 결과로 [결과 1]을 출력하고, [값 2]와 같으면 [결과 2]를 출력하는 방식입니다. 가장 마지막의 기본값은 비교할 값이 함수에 있는 그 어떤 값과도 같지 않을 때 출력됩니다.
고급틀 제작
변수의 이해
변수란 틀을 다른 문서에 끼워넣기 할 때 편집자가 변수에 해당하는 부분의 내용을 임의로 변경할 수 있는 값을 말합니다. 단순하게는 색을 바꾸는 정도에서, 테이블에 새로운 행을 추가하는 것도 가능합니다.
당연히 변수로 지정되지 않은 부분의 내용은 끼워넣기 할 때 변경할 수 없습니다.
변수틀의 기초
틀을 제작할 때 변수는 기본적으로 중괄호 세 쌍({{{변수}}})으로 생성합니다.
{{{1}}} 이것이 변수의 가장 기본적인 형태입니다. 이렇게 중괄호 세 쌍 안의 내용에는 변수의 이름 또는 순서가 들어가게 됩니다. 숫자를 입력하면 변수의 순서를 의미하고, 그외에 숫자가 아닌 문자열을 입력하면 변수의 이름을 의미합니다.
또한 변수의 이름 또는 순서 뒤에 파이프 문자(|)를 넣고 그 뒤에 변수의 기본값을 입력할 수 있습니다. 이 기본값은 해당 변수가 끼워넣기에서 사용되지 않았을 때 기본으로 출력됩니다. 예를 들어 이 변수는 {{{1|기본}}}입니다.와 같은 내용의 틀에서 변수를 사용하지 않고 끼워넣기만 했다면 이 변수는 기본입니다.와 같이 출력될 것입니다. 만약 파이프 문자만 넣고 그 뒤에 내용을 넣지 않으면 변수의 기본값은 공백이 됩니다.
변수는 틀을 끼워넣기 할 때 틀 이름 뒤에 파이프 문자를 넣음으로써 사용하게 되는데, 이때 순서로 입력된 변수는 단순히 변수에 들어갈 내용만을 순서에 맞게 작성하면 됩니다. 다만 이름으로 된 변수는 해당 변수의 이름을 선언한 뒤 등호(=)를 넣고 그 뒤에 변수에 들어갈 내용을 작성해야 합니다. 예를 들어 "abc"라는 제목의 틀 안에 있는 {{{이름변수}}}라는 변수를 사용하기 위해서는 {{abc|이름변수=변수 내용}}처럼 입력해야 합니다.
순서로 입력된 변수도 순서에 해당하는 숫자를 변수 이름처럼 사용할 수 있습니다. 예를 들어 내가 두 번째 변수는 사용하고 싶은데 첫 번째 변수는 사용하고 싶지 않을 때, 변수 이름처럼 2=변수 내용과 같이 사용 가능합니다.
이름 변수와 숫자 변수는 서로 영향을 주지 않습니다. 다시 말해, 이름이 있는 변수는 순서로 된 변수의 순서에 영향을 주지 않는다는 말입니다. {{abc|이름변수=변수 내용|첫 변수}}과 같이 입력하면 "첫 변수"는 {{{1}}}로 된 첫 번째 변수의 내용으로 입력됩니다.
각주
- ↑ 기본값은 to right, 이며 to left, to top, to bottom 등이 가능합니다.
- ↑ none:없음 / solid:실선 / dashed: 점선 / dotted: 짧은 점선 / double: 더블라인
- ↑ 칸 테두리와 내용 사이의 여백
- ↑ padding-right, padding-top, padding-bottom, padding-left로 방향 별로 다른 값을 설정할 수 있다.
- ↑ 칸 테두리와 표 외부의 객체 사이의 여백
- ↑ margin-right, margin-top, margin-bottom, margin-left로 방향 별로 다른 값을 설정할 수 있다.