r50
r1
1[[분류:테스트]][[분류:나무마크 문법]]
2== 개요 ==
3||<table align=right><nopad><table bordercolor=#abcdef> [youtube(9bZkp7q19f0, width=320px, height=240px)]||
4|| ---{{{#00A495 '''\{\{\{#!wiki style=""[br]\}\}\}'''}}}--- ||
r39
5[clearfix]
r43
6wiki 구문을 비롯한 style 부여 테스트.
r3
7나무위키 문법 도움말을 참고할 수 있다.
r1
8
r3
9몇몇 테스트는 RAW(원문) 참조.
10텍스트 등 양식(style)을 설정하고 출력할 범위를 지정하는 구문(문법).
r11
11기본적으로 개행을 하면 깨지는 문제가 있어 속에 나무마크 구문(문법)을 이용한 출력을 내기 곤란한 구문[* 예 : \[ \] 기호가 들어가는 주석][* {{{#!wiki style="display:inline;"
12>앞에서 언급한 인용문 구문을 더 설명하자면,
13>{{{#!wiki style="display:inline; font-family:monospace;"
14\[* > {{{#dodgerblue (인용할 내용)}}}\]}}} 식으로 입력하면 각주 안에 인용문을 넣기 불가능지만 이렇게 wiki 구문을 이용하면 각주 안에도 인용문을 ---집어---넣을 수도 있다.}}}]
15에 ---집어---넣어줄 수 있다.
r49
16== wiki 문법 ==
r43
17=== 빈 공간 ===
r3
18그냥 \{{{#!wiki 만 넣어도 동작된다. 별도 설정한 양식이 없는 구문인데, 기본값(default)에 따른 출력으로 나오는 모양이다.
r2
19
20{{{#!wiki
21무난하게 출력된다.}}}
r43
22=== style ===
r12
23{{{style=""}}} 그리고 콜론({{{:}}})[* 구분자. 양식(속성)이름:설정값 으로 동작되는 모양], 스페이스바[* 설정해야 하는 변수를 구분], 세미콜론({{{;}}})[* 설정할 양식을 각각으로 구분하는 표시(명령 구분자)] 등 기호를 잘 입력해야 한다.
r7
24##display:none을 두고 의도적으로 다르게 적은 문장.
r4
25{{{#!wiki style=""
r6
26style에 아무 것도 입력하지 않아도 (default) 출력할 수 있다.}}}
27{{{#!wiki style="display:none;"
28RAW 등으로만 볼 수 있는 설정이 있다.}}}{{{#!wiki style="display:nope;"
r7
29종류 이름 또는 설정값을 잘못 입력할 경우 없는 설정값(깨진 설정값)으로 인식하여 출력된다.}}}{{{#!wiki style="display:no;"
30가령 display:none을 입력해야 하는데, nope나 no 등으로 잘못 입력하면 입력하지 않은 것으로 읽어서 출력된다.}}}{{{#!wiki style="presentation:none;"
r8
31다시 말해서 정의되는 양식이름을 입력하고 양식에 따라 정의되는 설정값을 입력 양식에 맞게 입력해야 컴퓨터가 읽을 수 있으면서 편집자가 설정하고 싶은 양식으로 나오게 된다.}}}
32{{{#!wiki style="display:inline; display:none; display:inline;"
r9
33같은 양식이름에 정의되는 설정값을 적어놓은 단락이 2개 이상 있으면 컴퓨터가 왼쪽부터 오른쪽으로 읽게 되면서 마지막으로 적어놓은 설정으로 나오게 된다. 가령 display:inline; display:none; display:inline;으로 적어놓으면 display:none; 을 읽어도 마지막(그 오른쪽)의 display;inline;이 적용된다.}}}{{{#!wiki style="display:inline; display:inline; display:none;"
34(inline, inline, none을 입력하면 none을 읽게 되어 해당 문구는 나오지 않는다.)}}}
35{{{#!wiki style="display:inline;"
r13
36{{{style=""}}} 안에 매개변수와 그 값을 부여하는 표시(@@_@매개변수=@)를 집어넣고 저장한 문서를 include로 호출할 때 {{{style=""}}} 안에 넣었던 매개변수에 값을 주고 호출하게 되면 {{{style}}} 안에 매개변수를 넣었던 특정 단락이 깨져서 그 특정 단락에 대한 설정이 적용되지 않게 되었다. 이런 트릭을 넣고 생성된 틀이 많이 있었다.}}}
37
r15
38wiki의 style안에는 CSS를 집어넣는다. 종류에 따라 먼저 기입한 순서대로 처리되는데, 같은 요소를 입력할 때 display 처럼 설정값에 따라 결과가 번복될 수 있는 요소가 있는가 하면 radial-gradient 처럼 나오는 결과를 중첩시키는 요소가 있다.
39
r43
40=== if 문법과 연동 ===
r23
41if값에 따라 나오는 변수가 출력되는데, wiki 안에 들어갈 내용까지 반영되므로 입력할 수 있는 글자를 --AutoCAD-- 단축키 입력하듯이[* 예를 들어 "L"만 입력해도 바로 '''L'''ine(선 긋기) 명령을 내릴 수 있다.] 줄여 입력할 수 있다. 다만, @ 기호는 열고 닫기가 없기 때문에 @를 잘 열고 잘 닫아줘야 한다.
r15
42
r17
43이를테면 if 문법으로 \{{{#!if this.di="display: inline;"를 먼저 정의하면 뒤에 wiki 문법을 쓸 때 \{{{#!wiki style="display: inline;" 을 입력하는 대신 \{{{#! wiki style="@@_@di\@" 만 입력해도 \{{{#!wiki style="display: inline;을 쓴 것과 같게 나온다. 아예 앞의 style=" 부분도 \{{{#!if this.sty="style=\\"" 처럼 정의한 다음 \{{{#! wiki @@_@sty@@@_@di\@"로 줄여 입력시킬 수 있다.
r16
44##}}}}}}}}}}}}}}}}}}편집기 하이라이팅 버그
r15
45
r23
46아래는 모두 예시이며 쓰는 사람에 따라 다르게 쓸 수 있으므로 절대적이지는 않다.
r18
47 * d="'''d'''isplay:"
48 * db="'''d'''isplay: '''b'''lock;"
49 * df="'''d'''isplay: '''f'''lex;"
50 * dg="'''d'''isplay: '''g'''rid;"
51 * dt="'''d'''isplay: '''t'''able;"
52 * di="'''d'''isplay: '''i'''nline;"
53 * dib="'''d'''isplay: '''i'''nline-'''b'''lock;"
54 * dit="'''d'''isplay: '''i'''nline-'''t'''able;"
r19
55 * dif="'''d'''isplay: '''i'''nline-'''f'''lex;"
56 * dig="'''d'''isplay: '''i'''nline-'''g'''rid;"
r18
57 * dn="'''d'''isplay: '''n'''one;"
r19
58 * b 또는 bd="'''b'''order:"
59 * b 또는 bg="'''b'''ack'''g'''round:"
r21
60 * blg="'''b'''ackground: '''l'''inear-'''g'''radient" 또는 lg="'''l'''inear-'''g'''radient"
61 * brg="'''b'''ackground: '''r'''adial-'''g'''radient" 또는 rg="'''r'''inear-'''g'''radient"
62 * tor="'''to''' '''r'''ight"
r23
63 * tol="'''to''' '''l'''eft"
r18
64
r43
65=== 도트 ===
r24
66일단 이렇게 줄여 쓸 수 있으니 글자수를 획기적으로 적게 입력하면서 그려볼 수는 있겠다.
r34
67{{{#!if sty='style="', paint=sty+"display:inline-block;width:1em;height:1em;background:", mg=sty+'margin-top:-0.5em;"', w=paint+'transparent;"', wh=paint+'white;"',b=paint+'#5f4d3e;"', g=paint+'#00a495;"', p1=paint+'#dda0dd;"', p2=paint+'#e3d4f0;"', c=paint+'#00d1b2;"', b1=paint+'skyblue;"', b2=paint+'deepskyblue;"', we=paint+'wheat;"'
r27
68}}}{{{#!wiki style="max-width: 16em; overflow: hidden;"
69{{{#!wiki style="margin: -1.5em;"
r25
70[[https://namu.wiki|{{{#!wiki style="margin:1.5em"
r24
71{{{#!wiki @w@
72}}}{{{#!wiki @w@
r28
73}}}{{{#!wiki @g@
74}}}{{{#!wiki @g@
75}}}{{{#!wiki @g@
r24
76}}}{{{#!wiki @w@
77}}}{{{#!wiki @w@
78}}}{{{#!wiki @w@
79}}}{{{#!wiki @w@
80}}}{{{#!wiki @w@
81}}}{{{#!wiki @w@
82}}}{{{#!wiki @w@
83}}}{{{#!wiki @w@
84}}}{{{#!wiki @w@
85}}}{{{#!wiki @w@
86}}}{{{#!wiki @w@
87}}}{{{#!wiki @mg@
88{{{#!wiki @w@
89}}}{{{#!wiki @w@
r28
90}}}{{{#!wiki @g@
r24
91}}}{{{#!wiki @w@
r28
92}}}{{{#!wiki @g@
r24
93}}}{{{#!wiki @w@
r28
94}}}{{{#!wiki @g@
95}}}{{{#!wiki @g@
96}}}{{{#!wiki @g@
r24
97}}}{{{#!wiki @w@
98}}}{{{#!wiki @w@
99}}}{{{#!wiki @w@
100}}}{{{#!wiki @w@
101}}}{{{#!wiki @w@
102}}}{{{#!wiki @w@
r31
103}}}{{{#!wiki @w@
r24
104}}}}}}{{{#!wiki @mg@
105{{{#!wiki @w@
106}}}{{{#!wiki @w@
r28
107}}}{{{#!wiki @g@
108}}}{{{#!wiki @g@
109}}}{{{#!wiki @g@
r24
110}}}{{{#!wiki @w@
r28
111}}}{{{#!wiki @g@
r24
112}}}{{{#!wiki @w@
r28
113}}}{{{#!wiki @g@
r24
114}}}{{{#!wiki @w@
115}}}{{{#!wiki @w@
116}}}{{{#!wiki @w@
117}}}{{{#!wiki @w@
118}}}{{{#!wiki @w@
119}}}{{{#!wiki @w@
r31
120}}}{{{#!wiki @w@
r24
121}}}}}}{{{#!wiki @mg@
122{{{#!wiki @w@
123}}}{{{#!wiki @w@
124}}}{{{#!wiki @w@
r28
125}}}{{{#!wiki @b@
r24
126}}}{{{#!wiki @w@
127}}}{{{#!wiki @w@
r28
128}}}{{{#!wiki @g@
129}}}{{{#!wiki @g@
130}}}{{{#!wiki @g@
r24
131}}}{{{#!wiki @w@
132}}}{{{#!wiki @w@
133}}}{{{#!wiki @w@
134}}}{{{#!wiki @w@
r31
135}}}{{{#!wiki @g@
136}}}{{{#!wiki @g@
137}}}{{{#!wiki @g@
r24
138}}}}}}{{{#!wiki @mg@
139{{{#!wiki @w@
140}}}{{{#!wiki @w@
141}}}{{{#!wiki @w@
142}}}{{{#!wiki @w@
r28
143}}}{{{#!wiki @b@
r24
144}}}{{{#!wiki @w@
145}}}{{{#!wiki @w@
r28
146}}}{{{#!wiki @b@
147}}}{{{#!wiki @w@
148}}}{{{#!wiki @w@
149}}}{{{#!wiki @w@
150}}}{{{#!wiki @w@
r31
151}}}{{{#!wiki @b@
r24
152}}}{{{#!wiki @g@
r31
153}}}{{{#!wiki @w@
r28
154}}}{{{#!wiki @g@
155}}}}}}{{{#!wiki @mg@
156{{{#!wiki @w@
r24
157}}}{{{#!wiki @w@
158}}}{{{#!wiki @w@
159}}}{{{#!wiki @w@
r28
160}}}{{{#!wiki @b@
r24
161}}}{{{#!wiki @w@
r28
162}}}{{{#!wiki @w@
r24
163}}}{{{#!wiki @b@
164}}}{{{#!wiki @b@
165}}}{{{#!wiki @w@
166}}}{{{#!wiki @w@
r28
167}}}{{{#!wiki @b@
r24
168}}}{{{#!wiki @w@
169}}}{{{#!wiki @g@
r31
170}}}{{{#!wiki @g@
171}}}{{{#!wiki @g@
r28
172}}}}}}{{{#!wiki @mg@
r30
173{{{#!wiki @w@
r24
174}}}{{{#!wiki @w@
175}}}{{{#!wiki @w@
r30
176}}}{{{#!wiki @w@
177}}}{{{#!wiki @w@
r24
178}}}{{{#!wiki @b@
r28
179}}}{{{#!wiki @b@
r24
180}}}{{{#!wiki @w@
181}}}{{{#!wiki @b@
182}}}{{{#!wiki @b@
183}}}{{{#!wiki @b@
184}}}{{{#!wiki @w@
r31
185}}}{{{#!wiki @w@
186}}}{{{#!wiki @w@
187}}}{{{#!wiki @w@
188}}}{{{#!wiki @w@
r28
189}}}}}}{{{#!wiki @mg@
190{{{#!wiki @g@
r24
191}}}{{{#!wiki @g@
r30
192}}}{{{#!wiki @g@
193}}}{{{#!wiki @w@
r24
194}}}{{{#!wiki @b@
195}}}{{{#!wiki @b@
196}}}{{{#!wiki @w@
197}}}{{{#!wiki @w@
198}}}{{{#!wiki @w@
r28
199}}}{{{#!wiki @b@
r24
200}}}{{{#!wiki @w@
201}}}{{{#!wiki @w@
202}}}{{{#!wiki @w@
203}}}{{{#!wiki @w@
204}}}{{{#!wiki @w@
r26
205}}}{{{#!wiki @w@
r24
206}}}}}}{{{#!wiki @mg@
r28
207{{{#!wiki @g@
r30
208}}}{{{#!wiki @w@
r28
209}}}{{{#!wiki @g@
r30
210}}}{{{#!wiki @b@
r24
211}}}{{{#!wiki @w@
212}}}{{{#!wiki @w@
213}}}{{{#!wiki @w@
214}}}{{{#!wiki @w@
215}}}{{{#!wiki @w@
216}}}{{{#!wiki @w@
r28
217}}}{{{#!wiki @b@
r24
218}}}{{{#!wiki @w@
219}}}{{{#!wiki @w@
220}}}{{{#!wiki @w@
221}}}{{{#!wiki @w@
222}}}{{{#!wiki @w@
223}}}}}}{{{#!wiki @mg@
r30
224{{{#!wiki @g@
225}}}{{{#!wiki @g@
226}}}{{{#!wiki @g@
r24
227}}}{{{#!wiki @w@
228}}}{{{#!wiki @w@
229}}}{{{#!wiki @w@
230}}}{{{#!wiki @w@
231}}}{{{#!wiki @w@
232}}}{{{#!wiki @w@
233}}}{{{#!wiki @w@
234}}}{{{#!wiki @w@
235}}}{{{#!wiki @w@
236}}}{{{#!wiki @w@
237}}}{{{#!wiki @w@
238}}}{{{#!wiki @w@
239}}}{{{#!wiki @w@
r33
240}}}}}}}}}]]}}}}}}위 도트에는 [[나무위키]] 링크가 걸려있다.
r24
241
r33
242{{{#!wiki style="max-width: 16em; overflow: hidden;"
243{{{#!wiki style="margin: -1.5em;"
244[[https://www.alphawiki.org/|{{{#!wiki style="margin:1.5em"
245{{{#!wiki @w@
246}}}{{{#!wiki @w@
247}}}{{{#!wiki @w@
248}}}{{{#!wiki @w@
249}}}{{{#!wiki @w@
250}}}{{{#!wiki @p1@
251}}}{{{#!wiki @p1@
252}}}{{{#!wiki @p1@
253}}}{{{#!wiki @p1@
254}}}{{{#!wiki @p1@
255}}}{{{#!wiki @p1@
256}}}{{{#!wiki @w@
257}}}{{{#!wiki @w@
258}}}{{{#!wiki @w@
259}}}{{{#!wiki @w@
260}}}{{{#!wiki @w@
261}}}{{{#!wiki @mg@
262{{{#!wiki @w@
263}}}{{{#!wiki @w@
264}}}{{{#!wiki @w@
265}}}{{{#!wiki @w@
266}}}{{{#!wiki @p1@
267}}}{{{#!wiki @p1@
268}}}{{{#!wiki @p1@
269}}}{{{#!wiki @p1@
270}}}{{{#!wiki @p1@
271}}}{{{#!wiki @p1@
272}}}{{{#!wiki @p1@
273}}}{{{#!wiki @p1@
274}}}{{{#!wiki @w@
275}}}{{{#!wiki @w@
276}}}{{{#!wiki @w@
277}}}{{{#!wiki @w@
278}}}}}}{{{#!wiki @mg@
279{{{#!wiki @w@
280}}}{{{#!wiki @w@
281}}}{{{#!wiki @p1@
282}}}{{{#!wiki @p1@
283}}}{{{#!wiki @p1@
284}}}{{{#!wiki @p1@
285}}}{{{#!wiki @p1@
286}}}{{{#!wiki @p1@
287}}}{{{#!wiki @p1@
288}}}{{{#!wiki @p1@
289}}}{{{#!wiki @p1@
290}}}{{{#!wiki @p1@
291}}}{{{#!wiki @p1@
292}}}{{{#!wiki @p1@
293}}}{{{#!wiki @w@
294}}}{{{#!wiki @w@
295}}}}}}{{{#!wiki @mg@
296{{{#!wiki @w@
297}}}{{{#!wiki @w@
298}}}{{{#!wiki @p1@
299}}}{{{#!wiki @p1@
300}}}{{{#!wiki @p1@
301}}}{{{#!wiki @p1@
302}}}{{{#!wiki @wh@
303}}}{{{#!wiki @wh@
304}}}{{{#!wiki @wh@
305}}}{{{#!wiki @wh@
306}}}{{{#!wiki @p1@
307}}}{{{#!wiki @p1@
308}}}{{{#!wiki @p1@
309}}}{{{#!wiki @p1@
310}}}{{{#!wiki @w@
311}}}{{{#!wiki @w@
312}}}}}}{{{#!wiki @mg@
313{{{#!wiki @w@
314}}}{{{#!wiki @p1@
315}}}{{{#!wiki @p1@
316}}}{{{#!wiki @p1@
317}}}{{{#!wiki @p1@
318}}}{{{#!wiki @wh@
319}}}{{{#!wiki @p1@
320}}}{{{#!wiki @p1@
321}}}{{{#!wiki @p1@
322}}}{{{#!wiki @p1@
323}}}{{{#!wiki @wh@
324}}}{{{#!wiki @p1@
325}}}{{{#!wiki @p2@
326}}}{{{#!wiki @p1@
327}}}{{{#!wiki @p1@
328}}}{{{#!wiki @w@
329}}}}}}{{{#!wiki @mg@
330{{{#!wiki @p1@
331}}}{{{#!wiki @p1@
332}}}{{{#!wiki @p1@
333}}}{{{#!wiki @p1@
334}}}{{{#!wiki @wh@
335}}}{{{#!wiki @p1@
336}}}{{{#!wiki @p1@
337}}}{{{#!wiki @p1@
338}}}{{{#!wiki @p1@
339}}}{{{#!wiki @p1@
340}}}{{{#!wiki @p1@
341}}}{{{#!wiki @wh@
342}}}{{{#!wiki @p1@
343}}}{{{#!wiki @p1@
344}}}{{{#!wiki @p1@
345}}}{{{#!wiki @p1@
346}}}}}}{{{#!wiki @mg@
347{{{#!wiki @p1@
348}}}{{{#!wiki @p1@
349}}}{{{#!wiki @p1@
350}}}{{{#!wiki @wh@
351}}}{{{#!wiki @p1@
352}}}{{{#!wiki @p1@
353}}}{{{#!wiki @p1@
354}}}{{{#!wiki @p1@
355}}}{{{#!wiki @p1@
356}}}{{{#!wiki @p1@
357}}}{{{#!wiki @p2@
358}}}{{{#!wiki @p1@
359}}}{{{#!wiki @wh@
360}}}{{{#!wiki @p1@
361}}}{{{#!wiki @p1@
362}}}{{{#!wiki @p1@
363}}}}}}{{{#!wiki @mg@
364{{{#!wiki @p1@
365}}}{{{#!wiki @p1@
366}}}{{{#!wiki @p1@
367}}}{{{#!wiki @wh@
368}}}{{{#!wiki @p1@
369}}}{{{#!wiki @p1@
370}}}{{{#!wiki @p1@
371}}}{{{#!wiki @p1@
372}}}{{{#!wiki @p1@
373}}}{{{#!wiki @p1@
374}}}{{{#!wiki @p2@
375}}}{{{#!wiki @p1@
376}}}{{{#!wiki @wh@
377}}}{{{#!wiki @p1@
378}}}{{{#!wiki @p1@
379}}}{{{#!wiki @p1@
380}}}}}}{{{#!wiki @mg@
381{{{#!wiki @p1@
382}}}{{{#!wiki @p1@
383}}}{{{#!wiki @p1@
384}}}{{{#!wiki @wh@
385}}}{{{#!wiki @p1@
386}}}{{{#!wiki @p1@
387}}}{{{#!wiki @p1@
388}}}{{{#!wiki @p1@
389}}}{{{#!wiki @p1@
390}}}{{{#!wiki @p1@
391}}}{{{#!wiki @p2@
392}}}{{{#!wiki @p1@
393}}}{{{#!wiki @wh@
394}}}{{{#!wiki @p1@
395}}}{{{#!wiki @p1@
396}}}{{{#!wiki @p1@
397}}}}}}{{{#!wiki @mg@
398{{{#!wiki @p1@
399}}}{{{#!wiki @p1@
400}}}{{{#!wiki @p1@
401}}}{{{#!wiki @wh@
402}}}{{{#!wiki @p1@
403}}}{{{#!wiki @p1@
404}}}{{{#!wiki @p1@
405}}}{{{#!wiki @p1@
406}}}{{{#!wiki @p1@
407}}}{{{#!wiki @p1@
408}}}{{{#!wiki @p2@
409}}}{{{#!wiki @p1@
410}}}{{{#!wiki @wh@
411}}}{{{#!wiki @p1@
412}}}{{{#!wiki @p1@
413}}}{{{#!wiki @p1@
414}}}}}}{{{#!wiki @mg@
415{{{#!wiki @p1@
416}}}{{{#!wiki @p1@
417}}}{{{#!wiki @p1@
418}}}{{{#!wiki @p1@
419}}}{{{#!wiki @wh@
420}}}{{{#!wiki @p1@
421}}}{{{#!wiki @p1@
422}}}{{{#!wiki @p1@
423}}}{{{#!wiki @p1@
424}}}{{{#!wiki @p1@
425}}}{{{#!wiki @p1@
426}}}{{{#!wiki @wh@
427}}}{{{#!wiki @p1@
428}}}{{{#!wiki @p1@
429}}}{{{#!wiki @p1@
430}}}{{{#!wiki @p1@
431}}}}}}{{{#!wiki @mg@
432{{{#!wiki @w@
433}}}{{{#!wiki @p1@
434}}}{{{#!wiki @p1@
435}}}{{{#!wiki @p1@
436}}}{{{#!wiki @p1@
437}}}{{{#!wiki @wh@
438}}}{{{#!wiki @p1@
439}}}{{{#!wiki @p1@
440}}}{{{#!wiki @p1@
441}}}{{{#!wiki @p1@
442}}}{{{#!wiki @wh@
443}}}{{{#!wiki @p1@
444}}}{{{#!wiki @p2@
445}}}{{{#!wiki @p1@
446}}}{{{#!wiki @p1@
447}}}{{{#!wiki @w@
448}}}}}}{{{#!wiki @mg@
449{{{#!wiki @w@
450}}}{{{#!wiki @w@
451}}}{{{#!wiki @p1@
452}}}{{{#!wiki @p1@
453}}}{{{#!wiki @p1@
454}}}{{{#!wiki @p1@
455}}}{{{#!wiki @wh@
456}}}{{{#!wiki @wh@
457}}}{{{#!wiki @wh@
458}}}{{{#!wiki @wh@
459}}}{{{#!wiki @p1@
460}}}{{{#!wiki @p1@
461}}}{{{#!wiki @p1@
462}}}{{{#!wiki @p1@
463}}}{{{#!wiki @w@
464}}}{{{#!wiki @w@
465}}}}}}{{{#!wiki @mg@
466{{{#!wiki @w@
467}}}{{{#!wiki @w@
468}}}{{{#!wiki @p1@
469}}}{{{#!wiki @p1@
470}}}{{{#!wiki @p1@
471}}}{{{#!wiki @p1@
472}}}{{{#!wiki @p1@
473}}}{{{#!wiki @p1@
474}}}{{{#!wiki @p1@
475}}}{{{#!wiki @p1@
476}}}{{{#!wiki @p1@
477}}}{{{#!wiki @p1@
478}}}{{{#!wiki @p1@
479}}}{{{#!wiki @p1@
480}}}{{{#!wiki @w@
481}}}{{{#!wiki @w@
482}}}}}}{{{#!wiki @mg@
483{{{#!wiki @w@
484}}}{{{#!wiki @w@
485}}}{{{#!wiki @w@
486}}}{{{#!wiki @w@
487}}}{{{#!wiki @p1@
488}}}{{{#!wiki @p1@
489}}}{{{#!wiki @p1@
490}}}{{{#!wiki @p1@
491}}}{{{#!wiki @p1@
492}}}{{{#!wiki @p1@
493}}}{{{#!wiki @p1@
494}}}{{{#!wiki @p1@
495}}}{{{#!wiki @w@
496}}}{{{#!wiki @w@
497}}}{{{#!wiki @w@
498}}}{{{#!wiki @w@
499}}}}}}{{{#!wiki @mg@
500{{{#!wiki @w@
501}}}{{{#!wiki @w@
502}}}{{{#!wiki @w@
503}}}{{{#!wiki @w@
504}}}{{{#!wiki @w@
505}}}{{{#!wiki @p1@
506}}}{{{#!wiki @p1@
507}}}{{{#!wiki @p1@
508}}}{{{#!wiki @p1@
509}}}{{{#!wiki @p1@
510}}}{{{#!wiki @p1@
511}}}{{{#!wiki @w@
512}}}{{{#!wiki @w@
513}}}{{{#!wiki @w@
514}}}{{{#!wiki @w@
515}}}{{{#!wiki @w@
516}}}}}}}}}]]}}}}}}위 도트에는 [[알파위키]] 링크가 걸려있다.
r24
517
r40
518{{{#!if b='black', w='white'
r42
519}}}{{{#!wiki style="margin-top: -0.5em;"
r41
520''''''[Include(틀:도트, 값=@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@|@w@|@b@)]}}}
r38
521이렇게 하기에는 작업이 오래 걸려서 --귀찮--어려우므로, 응용만 해볼 수 있다면 [[틀:도트]]같은 틀을 만들어놓고 직접 그려볼 수 있다.
522
r49
523== style 문법 ==
r48
524Backend: 4200ff9; Frontend: bda2cf7; 업데이트가 있을 때 추가된 문법으로 추정된다. 앞의 위키(wiki)와는 다르게 여러 가지를 설정한 구성들 한 뭉치를 하나의 이름으로 저장할 수 있는 문법이다. [[https://namu.wiki/thread/ExuberantUptightJoblessBeggar#31|시범을 보이는 댓글]]에서 보다시피 스레드에도 지원이 되는 점을 보면 일반적인 \{{{#!wiki \}}} 로 마감되는 문법들과 연동된다. 특이하게 구성을 잘 살펴보면 html(hypertext markup language)에서 '''t'''able '''r'''ow, '''t'''able '''d'''ata를 줄여 tr, td로 부르는 부분과 tbady를 볼 수 있다.[* scope는 html에서 <th scope="값">처럼 별도 scope를 주는 문법으로 보인다.] 당연하겠지만 꾸미기에는 CSS가 들어가 있다.
r43
525
r50
526style 문법의 @theseed-dark-mode { } 구문은 wiki 문법의 dark-style=" " 처럼 대응되고, 설정할 대상을 찾아가는 방법은 html과 비슷하겠지만 모종의 하위 폴더로 들어가듯이 경로를 {{{>}}} 기호를 새기면서 구조를 따라 작성함으로써 설정할 대상을 찾아가야 한다. 대상을 찾은 다음 대상을 꾸미는 방법은 CSS처럼 꾸미는 모양이다.[* 문서에서 표로 나온 부분을 살펴보면 html과 css가 병합되어 있는 내용을 볼 수 있다.] 앞에 table.{{{#deepskyblue 이름}}} 식으로 들어가는 방식인 점에서, table이 아닌 다른 속성을 가지고 와 {{{#teal 종류}}}.{{{#deepskyblue 이름}}} 식으로 표(table)가 아닌 다른 부분에 별도 style을 달아볼 수는 있게 생겼다.
r49
527
r50
528구성을 만들었으면 이를 {{{#!wiki style="display: inline; font-family: monospace;"
529<tableclass={{{#deepskyblue 이름}}}>}}}을 입력하여 표 문법 안에 해당하는 이름의 class로 적용할 수 있다. 문서에 표를 여러 개 만들 일이 있고 여러 표에 똑같은 양식을 적용해야 할 때 해당하는 class만 부르면 쉬워질 것이다. 문서를 편집할 때 표 하나하나마다 일일이 양식을 새기지 않을 수 있다.
r44
530=== if 문법과 연동 ===
531놀랍게도 if 문법과 연동된다. 예를 들어 앞에 시범을 보이는 댓글에서
532>{{{#!wiki style="display: inline; font-family: monospace;"
533\{{{#!style
534/* scoped styles are not supported */
535table.colored > tbody > tr > td:first-of-type {
536 font-weight: bold;
537}
538table.colored > tbody > tr:nth-of-type(3n) > td:first-of-type {
539 color: red;
540}
541table.colored > tbody > tr:nth-of-type(3n + 1) > td:first-of-type {
542 color: lime;
543}
544table.colored > tbody > tr:nth-of-type(3n + 2) > td:first-of-type {
545 color: blue;
546}
547
548/* media query is not supported */
549@theseed-dark-mode {
550 table.colored > tbody > tr:nth-of-type(3n) > td:first-of-type {
551 color: maroon;
552 }
553 table.colored > tbody > tr:nth-of-type(3n + 1) > td:first-of-type {
554 color: green;
555 }
556 table.colored > tbody > tr:nth-of-type(3n + 2) > td:first-of-type {
557 color: navy;
558 }
559}
560\}}}\ }}}
561라는 문법을 --쓰기 귀찮아서-- if와 연동한다 할 때
562>{{{#!wiki style="display: inline; font-family: monospace;"
563\{{{#!if s="table.colored > tbody > tr", n=":nth-of-type"
564\}}}\{{{#!style
565/* scoped styles are not supported */
566--table.colored > tbody > tr--@@_@s@ > td:first-of-type {
567 font-weight: bold;
568}
569--table.colored > tbody > tr--@@_@s@--:nth-of-type--@@_@n@(3n) > td:first-of-type {
570 color: red;
571}
572--table.colored > tbody > tr--@@_@s@--:nth-of-type--@@_@n@(3n + 1) > td:first-of-type {
573 color: lime;
574}
575--table.colored > tbody > tr--@@_@s@--:nth-of-type--@@_@n@(3n + 2) > td:first-of-type {
576 color: blue;
577}
578
579/* media query is not supported */
580@theseed-dark-mode {
581 --table.colored > tbody > tr--@@_@s@--:nth-of-type--@@_@n@(3n) > td:first-of-type {
582 color: maroon;
583 }
584 --table.colored > tbody > tr--@@_@s@--:nth-of-type--@@_@n@(3n + 1) > td:first-of-type {
585 color: green;
586 }
587 --table.colored > tbody > tr--@@_@s@--:nth-of-type--@@_@n@(3n + 2) > td:first-of-type {
588 color: navy;
589 }
590}
591\}}}\ }}}
592식으로 줄여
593>{{{#!wiki style="display: inline; font-family: monospace;"
594\{{{#!if s="table.colored > tbody > tr", n=":nth-of-type"
595\}}}\{{{#!style
596/* scoped styles are not supported */
r46
597{{{#deepskyblue @@_@s@}}} > td:first-of-type {
r44
598 font-weight: bold;
599}
r46
600{{{#deepskyblue @@_@s@@@_@n@}}}(3n) > td:first-of-type {
r44
601 color: red;
602}
r46
603{{{#deepskyblue @@_@s@@@_@n@}}}(3n + 1) > td:first-of-type {
r44
604 color: lime;
605}
r46
606{{{#deepskyblue @@_@s@@@_@n@}}}(3n + 2) > td:first-of-type {
r44
607 color: blue;
608}
609
610/* media query is not supported */
611@theseed-dark-mode {
r46
612 {{{#deepskyblue @@_@s@@@_@n@}}}(3n) > td:first-of-type {
r44
613 color: maroon;
614 }
r46
615 {{{#deepskyblue @@_@s@@@_@n@}}}(3n + 1) > td:first-of-type {
r44
616 color: green;
617 }
r46
618 {{{#deepskyblue @@_@s@@@_@n@}}}(3n + 2) > td:first-of-type {
r44
619 color: navy;
620 }
621}
622\}}}\ }}}
r45
623처럼 표현해도 잘 동작이 된다.
624{{{#!folding 테스트 보기 (RAW 참고) [펼치기 · 접기]
r44
625{{{#!if s="table.colored > tbody > tr", n=":nth-of-type"
626}}}{{{#!style
627/* scoped styles are not supported */
628@s@ > td:first-of-type {
629 font-weight: bold;
630}
631@s@@n@(3n) > td:first-of-type {
632 color: red;
633}
634@s@@n@(3n + 1) > td:first-of-type {
635 color: lime;
636}
637@s@@n@(3n + 2) > td:first-of-type {
638 color: blue;
639}
640
641/* media query is not supported */
642@theseed-dark-mode {
643 @s@@n@(3n) > td:first-of-type {
644 color: maroon;
645 }
646 @s@@n@(3n + 1) > td:first-of-type {
647 color: green;
648 }
649 @s@@n@(3n + 2) > td:first-of-type {
650 color: navy;
651 }
652}
653}}}
654||<tableclass=colored><table width=100%><table bgcolor=#ffffff,#2d2f34><table color=#212529,#e0e0e0><colbgcolor=#ffffff,#000000> 1 ||1 ||
655|| 2 ||2 ||
656|| 3 ||3 ||
657|| 4 ||4 ||
658|| 5 ||5 ||
659|| 6 ||6 ||
660|| 7 ||7 ||
661|| 8 ||8 ||
662|| 9 ||9 ||
663|| 10 ||10 ||
664}}}
665
r15
666{{{#!wiki sytle="display:none"
667[각주]}}}