편집 요약 없음 |
편집 요약 없음 |
||
(같은 사용자의 중간 판 14개는 보이지 않습니다) | |||
8번째 줄: | 8번째 줄: | ||
{{안내문|'''틀의 margin과 padding 값은 가능한 수정하지 말아 주세요.''' 현재 값은 브라우저의 F12 개발자 도구로 위키에 적용된 정확한 값을 수정한 것입니다.}} | {{안내문|'''틀의 margin과 padding 값은 가능한 수정하지 말아 주세요.''' 현재 값은 브라우저의 F12 개발자 도구로 위키에 적용된 정확한 값을 수정한 것입니다.}} | ||
== 틀 본문 == | == 틀 본문 == | ||
<onlyinclude><includeonly>{{css|펼치기 접기}}<div id="toggle{{{id|jwiki-1}}}" class="toggleBtn mobileBtn" data-target="collapsible{{{id|jwiki-1}}}" style="text-align: center; margin: 0 -{{#expr:9+2/3}}px; padding: 0 {{#expr:9+2/3}}px; color: {{{titlecolor|#373a3c}}}; text-align:{{{align|center}}}; {{#ifeq:{{{복사방지|}}}|off||user-select: none;}} {{{divstyle|}}}">{{#ifeq:{{{titletype|}}}|media|{{nobold|[{{가짜 링크|notitle=on|{{{title|보기}}}}}]}}|{{{title|[ 펼치기 · 접기 ]}}}}}</div> | <onlyinclude><includeonly>{{css|펼치기 접기}}<div id="toggle{{{id|jwiki-1}}}" class="toggleBtn mobileBtn" data-target="collapsible{{{id|jwiki-1}}}" style="text-align: center; margin: 0 -{{#expr:9+2/3}}px; padding: 0 {{#expr:9+2/3}}px; color: {{#switch:{{{titlecolor|}}}|link = #0275d8|nolink = #ff0000|exlink = #009900|darklink = #ec9f19|jwiki = #880e4f|default = #373a3c|{{{titlecolor|inherit}}}}}; text-align:{{{align|center}}}; {{#ifeq:{{{복사방지|}}}|off||user-select: none;}} {{#if:{{{multi|}}}|display: inline-block; width: {{{multiwidth|}}};|}} {{{divstyle|}}}">{{#ifeq:{{{titletype|}}}|media|{{nobold|[{{가짜 링크|notitle=on|{{{title|보기}}}}}]}}|{{{title|[ 펼치기 · 접기 ]}}}}}</div> | ||
<div id="collapsible{{{id|jwiki-1}}}" class="{{#if:{{{multi|}}}|folding-margin-remove-width-multi|folding-margin-remove-width}}"> | <div id="collapsible{{{id|jwiki-1}}}" class="{{#if:{{{multi|}}}|{{#ifeq:{{{multi|}}}|bottom|folding-margin-remove-width|folding-margin-remove-width-multi}}|folding-margin-remove-width}}"> | ||
{|class="wikitable {{{class|}}}" {{{tag|}}} style="width: {{{width|100%}}}; margin: .3rem 0 {{#if:{{{multi|}}}|.3rem|-.3rem}}; {{#if:{{{max-width|}}}|max-width: {{{max-width|}}};|}} {{#if:{{{bg|}}}|background: {{{bg|}}};|}} {{#if:{{{text|}}}|text-align: {{{text|}}};|}} {{#if:{{{layout|}}}|table-layout: fixed;|}} {{{style|}}}"</includeonly></onlyinclude> | {|class="wikitable {{{class|}}}" {{{tag|}}} style="width: {{{width|100%}}}; margin: .3rem 0 {{#if:{{{multi|}}}|{{#ifeq:{{{multi|}}}|bottom|-.3rem|.3rem}}|-.3rem}}; {{#if:{{{max-width|}}}|max-width: {{{max-width|}}};|}} {{#if:{{{bg|}}}|background: {{{bg|}}};|}} {{#if:{{{text|}}}|text-align: {{{text|}}};|}} {{#if:{{{layout|}}}|table-layout: fixed;|}} {{{style|}}}"</includeonly></onlyinclude> | ||
== 설명 == | == 설명 == | ||
[[사용자:Kimchan]]의 [[틀:나무위키 틀 접기|틀]]을 바탕으로 나무위키처럼 애니메이션 효과가 추가된 틀입니다. 아래의 설명 역시 부분만 변형했습니다. | [[사용자:Kimchan]]의 [[틀:나무위키 틀 접기|틀]]을 바탕으로 나무위키처럼 애니메이션 효과가 추가된 틀입니다. 아래의 설명 역시 부분만 변형했습니다. | ||
74번째 줄: | 74번째 줄: | ||
|- | |- | ||
|{{나무접기2|id=example-two|align=center|div=off}} | |{{나무접기2|id=example-two|align=center|div=off}} | ||
{|class="wikitable" style="width: 100%;" | {|class="wikitable" style="width: 100%; margin: .8rem 0;" | ||
|- | |- | ||
|내용내용내용내용내용내용내용내용 | |내용내용내용내용내용내용내용내용 | ||
93번째 줄: | 93번째 줄: | ||
|}</div> | |}</div> | ||
{{MT끝}} | {{MT끝}} | ||
== 한 줄에 여러 개의 접기 == | |||
새로운 변수들을 사용합니다. | |||
{|{{style|class=wiki|width=100%}} | |||
|- | |||
!multi | |||
|본격적으로 여러 개의 접기를 선언하는 변수입니다. 아무 값이나 입력해도 되지만, '''가장 마지막에 오는 펼접 틀에서는 {{u|bottom}}으로 입력합니다.''' 모든 펼접 틀에 전부 입력해야 합니다. | |||
|- | |||
!multiwidth | |||
|각 접기의 너비를 정합니다. 마찬가지로 모든 펼접 틀에 전부 입력해야 합니다. 입력하지 않아도 되지만, 이 경우 각 제목 사이가 딱 붙어 버리므로 각 제목 양옆에 ㄱ+한자+1에 있는 공백 문자로 너비를 벌릴 것을 권장합니다. | |||
|} | |||
단순히 하나의 펼접 틀이 끝나는 곳, 즉 <nowiki>{{펼접끝}}</nowiki>이 오는 뒤에 새로운 펼접 틀을 이어서 작성하면 됩니다. | |||
=== [[틀:펼치기 접기/multi]]와의 차이 === | |||
멀티 펼접 틀은 접기를 전부 펼치면 접기 제목은 여전히 그 줄에 전부 있고 테이블은 그 아래에 전부 있지만, 위 방법은 접기를 전부 펼치면 접기 제목이 해당하는 테이블의 윗줄에 놓이게 됩니다. | |||
{|{{style|class=wiki|width=100%|layout=on}} | |||
|- | |||
!문법||결과 | |||
|- | |||
!colspan=2|멀티 틀 | |||
|- | |||
|{{style|vertical=top}}|{{folding|id=gram1|title=[ 문법 펼치기 · 접기 ]|<pre>{|class="wikitable" style="margin: 12px auto; text-align: center;" | |||
|- | |||
|틀 사용 | |||
|- | |||
|{{펼접/mt | |||
|id1=1|title1=[ 1의 제목 ] | |||
|id2=2|title2=[ 2의 제목 ] | |||
}} | |||
{{펼접/mc|id=1}} | |||
|- | |||
|1의 내용 | |||
{{펼접끝}} | |||
{{펼접/mc|id=2}} | |||
|- | |||
|2의 내용 | |||
{{펼접끝}} | |||
|}</pre>}} | |||
|{{style|vertical=top}}| | |||
{|class="wikitable" style="margin: 12px auto; text-align: center;" | |||
|- | |||
|틀 사용 | |||
|- | |||
|{{펼접/mt | |||
|id1=1|title1=[ 1의 제목 ] | |||
|id2=2|title2=[ 2의 제목 ] | |||
}} | |||
{{펼접/mc|id=1}} | |||
|- | |||
|1의 내용 | |||
{{펼접끝}} | |||
{{펼접/mc|id=2}} | |||
|- | |||
|2의 내용 | |||
{{펼접끝}} | |||
|} | |||
|- | |||
!colspan=2|멀티 변수 | |||
|- | |||
|{{style|vertical=top}}|{{folding|id=gram2|title=[ 문법 펼치기 · 접기 ]|<pre>{|class="wikitable" style="margin: 12px auto; text-align: center;" | |||
|- | |||
|변수 사용 | |||
|- | |||
|{{펼접|id=3|title= [ 1의 제목 ] |multi=on}} | |||
|- | |||
|1의 내용 | |||
{{펼접끝}} | |||
{{펼접|id=4|title= [ 2의 제목 ] |multi=bottom}} | |||
|- | |||
|2의 내용 | |||
{{펼접끝}} | |||
|}</pre>}} | |||
|{{style|vertical=top}}| | |||
{|class="wikitable" style="margin: 12px auto; text-align: center;" | |||
|- | |||
|변수 사용 | |||
|- | |||
|{{펼접|id=3|title= [ 1의 제목 ] |multi=on}} | |||
|- | |||
|1의 내용 | |||
{{펼접끝}} | |||
{{펼접|id=4|title= [ 2의 제목 ] |multi=bottom}} | |||
|- | |||
|2의 내용 | |||
{{펼접끝}} | |||
|} | |||
|} | |||
== 기타 == | == 기타 == |
2024년 3월 4일 (월) 23:29 판
틀:펼치기 접기 | |
---|---|
사용문서
|
|
넘겨주기
|
이동하기
|
[ 주요 업데이트 노트 ]
|
틀의 원리에 대한 내용은 도움말:위키 문법 문서의 표에서 응용하기 문단을 참고하십시오. 한 줄에 여러 개의 접기를 넣는 틀에 대한 내용은 틀:펼치기 접기/multi 문서를 참고하십시오. 관련 문서: 틀:나무위키 틀 접기, 틀:나무위키 접기2
틀의 margin과 padding 값은 가능한 수정하지 말아 주세요. 현재 값은 브라우저의 F12 개발자 도구로 위키에 적용된 정확한 값을 수정한 것입니다.
틀 본문
설명
사용자:Kimchan의 틀을 바탕으로 나무위키처럼 애니메이션 효과가 추가된 틀입니다. 아래의 설명 역시 부분만 변형했습니다.
이 틀을 이용하면 마지막에 틀:펼치기 접기 끝을 넣어서 틀을 끝내줘야합니다.
환경설정의 편집 부분의 "페이지를 다시 불러오지 않고 미리 보기 표시"를 활성화할 경우 편집 미리보기에서 접기가 작동하지 않습니다.
변수
모든 변수는 선택입니다. | |
---|---|
id | 접기의 클래스와 아이디입니다. 입력하지 않으면 jwiki-1라는 아이디가 기본으로 입력되나, 반드시 입력할 것을 권장합니다. |
title | 접기의 제목입니다. 입력하지 않으면 [ 펼치기 · 접기 ]가 기본으로 입력됩니다. |
titlecolor | 접기 제목의 글씨 색입니다. 기본값은 제이위키 기본 글자 색과 같은 #373a3c입니다. 이 틀이 들어가는 행의 배경 색에 따라, 또는 단지 꾸미고 싶을 때 다른 색으로 입력할 수 있습니다. |
divstyle | 접기 제목이 들어가는 div의 style 태그에 추가로 넣을 코드를 입력할 수 있습니다. |
class | 안쪽 테이블의 class를 지정할 수 있습니다. |
style | 안쪽 테이블의 style 태그에 추가로 넣을 코드를 입력할 수 있습니다. |
tag | 안쪽 테이블에 class나 style 외에 다른 태그를 추가로 입력할 수 있습니다. |
width | 간혹 표 내의 크기 지정이 안되면 이용할 수 있습니다. 보통 문제가 생길시 auto만 입력해도 됩니다. |
align | 제목의 위치를 조절합니다. left, center, right 등을 입력할 수 있습니다. 기본값은 center. |
사용 예제
문법 | [ 문법 펼치기 · 접기 ] {|class="wikitable" style="text-align: center;" |- |틀 사용 |- |{{펼접|id=example-one}} |- |내용내용내용내용내용내용내용내용 |- |내용내용내용내용내용내용내용내용 {{펼접끝}} |} | ||||||||
---|---|---|---|---|---|---|---|---|---|
결과 |
|
한 줄에 여러 개의 접기
새로운 변수들을 사용합니다.
multi | 본격적으로 여러 개의 접기를 선언하는 변수입니다. 아무 값이나 입력해도 되지만, 가장 마지막에 오는 펼접 틀에서는 bottom으로 입력합니다. 모든 펼접 틀에 전부 입력해야 합니다. |
---|---|
multiwidth | 각 접기의 너비를 정합니다. 마찬가지로 모든 펼접 틀에 전부 입력해야 합니다. 입력하지 않아도 되지만, 이 경우 각 제목 사이가 딱 붙어 버리므로 각 제목 양옆에 ㄱ+한자+1에 있는 공백 문자로 너비를 벌릴 것을 권장합니다. |
단순히 하나의 펼접 틀이 끝나는 곳, 즉 {{펼접끝}}이 오는 뒤에 새로운 펼접 틀을 이어서 작성하면 됩니다.
틀:펼치기 접기/multi와의 차이
멀티 펼접 틀은 접기를 전부 펼치면 접기 제목은 여전히 그 줄에 전부 있고 테이블은 그 아래에 전부 있지만, 위 방법은 접기를 전부 펼치면 접기 제목이 해당하는 테이블의 윗줄에 놓이게 됩니다.
문법 | 결과 | ||||
---|---|---|---|---|---|
멀티 틀 | |||||
[ 문법 펼치기 · 접기 ] {|class="wikitable" style="margin: 12px auto; text-align: center;" |- |틀 사용 |- |{{펼접/mt |id1=1|title1=[ 1의 제목 ] |id2=2|title2=[ 2의 제목 ] }} {{펼접/mc|id=1}} |- |1의 내용 {{펼접끝}} {{펼접/mc|id=2}} |- |2의 내용 {{펼접끝}} |} |
| ||||
멀티 변수 | |||||
[ 문법 펼치기 · 접기 ] {|class="wikitable" style="margin: 12px auto; text-align: center;" |- |변수 사용 |- |{{펼접|id=3|title= [ 1의 제목 ] |multi=on}} |- |1의 내용 {{펼접끝}} {{펼접|id=4|title= [ 2의 제목 ] |multi=bottom}} |- |2의 내용 {{펼접끝}} |} |
|
기타
둘러보기
+ 나무위키 형식 틀 모음 | ||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
[ 펼치기 · 접기 ]
|