|
|
1번째 줄: |
1번째 줄: |
| <includeonly><onlyinclude>{{#if:{{{1|}}}|<div class="tabs-container formatted"><!-- ul을 사용하면, content 부분에 *를 사용했을 때 safe HTML이 자동으로 ul을 닫기 때문에 레이아웃이 깨짐. 따라서 div를 사용
| | <onlyinclude><div class="libre-tab"> |
| --><div class="tabs-control formatted"><div class="selected">{{{1|}}}</div>{{#if:{{{3|}}}|<div>{{{3}}}</div>}}{{#if:{{{5|}}}|<div>{{{5}}}</div>}}{{#if:{{{7|}}}|<div>{{{7}}}</div>}}{{#if:{{{9|}}}|<div>{{{9}}}</div>}}{{#if:{{{11|}}}|<div>{{{11}}}</div>}}{{#if:{{{13|}}}|<div>{{{13}}}</div>}}{{#if:{{{15|}}}|<div>{{{15}}}</div>}}{{#if:{{{17|}}}|<div>{{{17}}}</div>}}{{#if:{{{19|}}}|<div>{{{19}}}</div>}}{{#if:{{{21|}}}|<div>{{{21}}}</div>}}{{#if:{{{23|}}}|<div>{{{23}}}</div>}}{{#if:{{{25|}}}|<div>{{{25}}}</div>}}{{#if:{{{27|}}}|<div>{{{27}}}</div>}}{{#if:{{{29|}}}|<div>{{{29}}}</div>}}{{#if:{{{31|}}}|<div>{{{31}}}</div>}}{{#if:{{{33|}}}|<div>{{{33}}}</div>}}{{#if:{{{35|}}}|<div>{{{35}}}</div>}}{{#if:{{{37|}}}|<div>{{{37}}}</div>}}{{#if:{{{39|}}}|<div>{{{39}}}</div>}}{{#if:{{{41|}}}|<div>{{{41}}}</div>}}{{#if:{{{43|}}}|<div>{{{43}}}</div>}}{{#if:{{{45|}}}|<div>{{{45}}}</div>}}{{#if:{{{47|}}}|<div>{{{47}}}</div>}}{{#if:{{{49|}}}|<div>{{{49}}}</div>}}{{#if:{{{51|}}}|<div>{{{51}}}</div>}}{{#if:{{{53|}}}|<div>{{{53}}}</div>}}{{#if:{{{55|}}}|<div>{{{55}}}</div>}}{{#if:{{{57|}}}|<div>{{{57}}}</div>}}{{#if:{{{59|}}}|<div>{{{59}}}</div>}}{{#if:{{{61|}}}|<div>{{{61}}}</div>}}{{#if:{{{63|}}}|<div>{{{63}}}</div>}}{{#if:{{{65|}}}|<div>{{{65}}}</div>}}{{#if:{{{67|}}}|<div>{{{67}}}</div>}}{{#if:{{{69|}}}|<div>{{{69}}}</div>}}{{#if:{{{71|}}}|<div>{{{71}}}</div>}}{{#if:{{{73|}}}|<div>{{{73}}}</div>}}{{#if:{{{75|}}}|<div>{{{75}}}</div>}}{{#if:{{{77|}}}|<div>{{{77}}}</div>}}{{#if:{{{79|}}}|<div>{{{79}}}</div>}}{{#if:{{{81|}}}|<div>{{{81}}}</div>}}{{#if:{{{83|}}}|<div>{{{83}}}</div>}}{{#if:{{{85|}}}|<div>{{{85}}}</div>}}{{#if:{{{87|}}}|<div>{{{87}}}</div>}}{{#if:{{{89|}}}|<div>{{{89}}}</div>}}{{#if:{{{91|}}}|<div>{{{91}}}</div>}}{{#if:{{{93|}}}|<div>{{{93}}}</div>}}{{#if:{{{95|}}}|<div>{{{95}}}</div>}}{{#if:{{{97|}}}|<div>{{{97}}}</div>}}{{#if:{{{99|}}}|<div>{{{99}}}</div>}}{{#if:{{{101|}}}|<div>{{{101}}}</div>}}{{#if:{{{103|}}}|<div>{{{103}}}</div>}}{{#if:{{{105|}}}|<div>{{{105}}}</div>}}{{#if:{{{107|}}}|<div>{{{107}}}</div>}}{{#if:{{{109|}}}|<div>{{{109}}}</div>}}</div><!--
| | <ul class="libre-tab-btns"><li class="libre-tab-btn libre-tab-btn-active">{{{제목1}}}</li>{{#if:{{{제목2|}}}|<li class="libre-tab-btn">{{{제목2}}}</li>}}{{#if:{{{제목3|}}}|<li class="libre-tab-btn">{{{제목3}}}</li>}}{{#if:{{{제목4|}}}|<li class="libre-tab-btn">{{{제목4}}}</li>}}{{#if:{{{제목5|}}}|<li class="libre-tab-btn">{{{제목5}}}</li>}}{{#if:{{{제목6|}}}|<li class="libre-tab-btn">{{{제목6}}}</li>}}{{#if:{{{제목7|}}}|<li class="libre-tab-btn">{{{제목7}}}</li>}}{{#if:{{{제목8|}}}|<li class="libre-tab-btn">{{{제목8}}}</li>}}{{#if:{{{제목9|}}}|<li class="libre-tab-btn">{{{제목9}}}</li>}}{{#if:{{{제목10|}}}|<li class="libre-tab-btn">{{{제목10}}}</li>}}{{#if:{{{제목11|}}}|<li class="libre-tab-btn">{{{제목11}}}</li>}}{{#if:{{{제목12|}}}|<li class="libre-tab-btn">{{{제목12}}}</li>}}{{#if:{{{제목13|}}}|<li class="libre-tab-btn">{{{제목13}}}</li>}}{{#if:{{{제목14|}}}|<li class="libre-tab-btn">{{{제목14}}}</li>}}{{#if:{{{제목15|}}}|<li class="libre-tab-btn">{{{제목15}}}</li>}}{{#if:{{{제목16|}}}|<li class="libre-tab-btn">{{{제목16}}}</li>}}{{#if:{{{제목17|}}}|<li class="libre-tab-btn">{{{제목17}}}</li>}}{{#if:{{{제목18|}}}|<li class="libre-tab-btn">{{{제목18}}}</li>}}{{#if:{{{제목19|}}}|<li class="libre-tab-btn">{{{제목19}}}</li>}}{{#if:{{{제목20|}}}|<li class="libre-tab-btn">{{{제목20}}}</li>}}{{#if:{{{제목21|}}}|<li class="libre-tab-btn">{{{제목21}}}</li>}}{{#if:{{{제목22|}}}|<li class="libre-tab-btn">{{{제목22}}}</li>}}{{#if:{{{제목23|}}}|<li class="libre-tab-btn">{{{제목23}}}</li>}}{{#if:{{{제목24|}}}|<li class="libre-tab-btn">{{{제목24}}}</li>}}{{#if:{{{제목25|}}}|<li class="libre-tab-btn">{{{제목25}}}</li>}}{{#if:{{{제목26|}}}|<li class="libre-tab-btn">{{{제목26}}}</li>}}{{#if:{{{제목27|}}}|<li class="libre-tab-btn">{{{제목27}}}</li>}}{{#if:{{{제목28|}}}|<li class="libre-tab-btn">{{{제목28}}}</li>}}{{#if:{{{제목29|}}}|<li class="libre-tab-btn">{{{제목29}}}</li>}}{{#if:{{{제목30|}}}|<li class="libre-tab-btn">{{{제목30}}}</li>}}</ul> |
| | | <div class="libre-tab-main"> |
| --><div class="tabs-content formatted"><div>{{{2|}}}</div>{{#if:{{{4|}}}|<div>{{{4}}}</div>}}{{#if:{{{6|}}}|<div>{{{6}}}</div>}}{{#if:{{{8|}}}|<div>{{{8}}}</div>}}{{#if:{{{10|}}}|<div>{{{10}}}</div>}}{{#if:{{{12|}}}|<div>{{{12}}}</div>}}{{#if:{{{14|}}}|<div>{{{14}}}</div>}}{{#if:{{{16|}}}|<div>{{{16}}}</div>}}{{#if:{{{18|}}}|<div>{{{18}}}</div>}}{{#if:{{{20|}}}|<div>{{{20}}}</div>}}{{#if:{{{22|}}}|<div>{{{22}}}</div>}}{{#if:{{{24|}}}|<div>{{{24}}}</div>}}{{#if:{{{26|}}}|<div>{{{26}}}</div>}}{{#if:{{{28|}}}|<div>{{{28}}}</div>}}{{#if:{{{30|}}}|<div>{{{30}}}</div>}}{{#if:{{{32|}}}|<div>{{{32}}}</div>}}{{#if:{{{34|}}}|<div>{{{34}}}</div>}}{{#if:{{{36|}}}|<div>{{{36}}}</div>}}{{#if:{{{38|}}}|<div>{{{38}}}</div>}}{{#if:{{{40|}}}|<div>{{{40}}}</div>}}{{#if:{{{42|}}}|<div>{{{42}}}</div>}}{{#if:{{{44|}}}|<div>{{{44}}}</div>}}{{#if:{{{46|}}}|<div>{{{46}}}</div>}}{{#if:{{{48|}}}|<div>{{{48}}}</div>}}{{#if:{{{50|}}}|<div>{{{50}}}</div>}}{{#if:{{{52|}}}|<div>{{{52}}}</div>}}{{#if:{{{54|}}}|<div>{{{54}}}</div>}}{{#if:{{{56|}}}|<div>{{{56}}}</div>}}{{#if:{{{58|}}}|<div>{{{58}}}</div>}}{{#if:{{{60|}}}|<div>{{{60}}}</div>}}{{#if:{{{62|}}}|<div>{{{62}}}</div>}}{{#if:{{{64|}}}|<div>{{{64}}}</div>}}{{#if:{{{66|}}}|<div>{{{66}}}</div>}}{{#if:{{{68|}}}|<div>{{{68}}}</div>}}{{#if:{{{70|}}}|<div>{{{70}}}</div>}}{{#if:{{{72|}}}|<div>{{{72}}}</div>}}{{#if:{{{74|}}}|<div>{{{74}}}</div>}}{{#if:{{{76|}}}|<div>{{{76}}}</div>}}{{#if:{{{78|}}}|<div>{{{78}}}</div>}}{{#if:{{{80|}}}|<div>{{{80}}}</div>}}{{#if:{{{82|}}}|<div>{{{82}}}</div>}}{{#if:{{{84|}}}|<div>{{{84}}}</div>}}{{#if:{{{86|}}}|<div>{{{86}}}</div>}}{{#if:{{{88|}}}|<div>{{{88}}}</div>}}{{#if:{{{90|}}}|<div>{{{90}}}</div>}}{{#if:{{{92|}}}|<div>{{{92}}}</div>}}{{#if:{{{94|}}}|<div>{{{94}}}</div>}}{{#if:{{{96|}}}|<div>{{{96}}}</div>}}{{#if:{{{98|}}}|<div>{{{98}}}</div>}}{{#if:{{{100|}}}|<div>{{{100}}}</div>}}{{#if:{{{102|}}}|<div>{{{102}}}</div>}}{{#if:{{{104|}}}|<div>{{{104}}}</div>}}{{#if:{{{106|}}}|<div>{{{106}}}</div>}}{{#if:{{{108|}}}|<div>{{{108}}}</div>}}{{#if:{{{110|}}}|<div>{{{110}}}</div>}}</div><!--
| | <div class="libre-tab-main-content libre-tab-main-content-active"> |
| | | {{{내용1}}} |
| --></div>}}</onlyinclude></includeonly>
| | </div>{{#if:{{{제목2|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용2}}} |
| | </div>}}{{#if:{{{제목3|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용3}}} |
| | </div>}}{{#if:{{{제목4|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용4}}} |
| | </div>}}{{#if:{{{제목5|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용5}}} |
| | </div>}}{{#if:{{{제목6|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용6}}} |
| | </div>}}{{#if:{{{제목7|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용7}}} |
| | </div>}}{{#if:{{{제목8|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용8}}} |
| | </div>}}{{#if:{{{제목9|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용9}}} |
| | </div>}}{{#if:{{{제목10|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용10}}} |
| | </div>}}{{#if:{{{제목11|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용11}}} |
| | </div>}}{{#if:{{{제목12|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용12}}} |
| | </div>}}{{#if:{{{제목13|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용13}}} |
| | </div>}}{{#if:{{{제목14|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용14}}} |
| | </div>}}{{#if:{{{제목15|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용15}}} |
| | </div>}}{{#if:{{{제목16|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용16}}} |
| | </div>}}{{#if:{{{제목17|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용17}}} |
| | </div>}}{{#if:{{{제목18|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용18}}} |
| | </div>}}{{#if:{{{제목19|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용19}}} |
| | </div>}}{{#if:{{{제목20|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용20}}} |
| | </div>}}{{#if:{{{제목21|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용21}}} |
| | </div>}}{{#if:{{{제목22|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용22}}} |
| | </div>}}{{#if:{{{제목23|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용23}}} |
| | </div>}}{{#if:{{{제목24|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용24}}} |
| | </div>}}{{#if:{{{제목25|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용25}}} |
| | </div>}}{{#if:{{{제목26|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용26}}} |
| | </div>}}{{#if:{{{제목27|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용27}}} |
| | </div>}}{{#if:{{{제목28|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용28}}} |
| | </div>}}{{#if:{{{제목29|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용29}}} |
| | </div>}}{{#if:{{{제목30|}}}| |
| | <div class="libre-tab-main-content"> |
| | {{{내용30}}} |
| | </div>}} |
| | </div> |
| | </div></onlyinclude> |
| {{틀 설명문서}} | | {{틀 설명문서}} |
| [[분류:틀]]
| |
탭을 만드는 틀입니다.
사용법
{{탭
|제목1 =
|내용1 =
|제목2 =
|내용2 =
|제목3 =
|내용3 =
·
·
·
|제목30 =
|내용30 =
}}
- 추가 기능
{{탭
|style =
|버튼여백좁게 = <!-- 이 변수를 입력할 경우 탭 버튼 여백이 줄어듦-->
|제목너비고정 = <!-- **%로 입력, 한 줄당 탭 버튼 수를 강제로 고정하기 위해 사용함-->
|여백좁게 = <!-- 이 변수를 입력할 경우 여백이 1.5 rem에서 0.5 rem으로 줄어듦-->
|여백 사용자지정 = <!-- 단위 (em, rem 등)를 포함해 입력-->
|제목1 =
|내용1 =
|제목2 =
|내용2 =
|제목3 =
|내용3 =
·
·
·
|제목30 =
|내용30 =
}}
틀 데이터
틀 데이터
틀 변수[틀데이터 편집] 이 틀은 변수마다 줄바꿈을 하여 쓰는 것이 권장됩니다. 변수 | 설명 | 형식 | 상태 |
---|
style | style | 지정할 CSS 스타일을 입력합니다.
| 문자열 | 선택 사항 |
---|
버튼여백좁게 | 버튼여백좁게 | 이 변수를 입력할 경우 탭 버튼 여백이 줄어듭니다.
| 불리언 | 선택 사항 |
---|
제목너비고정 | 제목너비고정 | **%로 입력, 한 줄당 탭 버튼 수를 강제로 고정하기 위해 사용합니다.
| 문자열 | 선택 사항 |
---|
여백좁게 | 여백좁게 | 이 변수를 입력할 경우 여백이 1.5rem에서 0.5rem으로 줄어듭니다.
| 불리언 | 선택 사항 |
---|
여백 사용자지정 | 여백 사용자지정 | 단위 (em, rem 등)를 포함해 숫자를 입력합니다.
| 문자열 | 선택 사항 |
---|
제목1 | 제목1 | 첫 번째 탭의 제목을 입력합니다.
| 문자열 | 권장 |
---|
내용1 | 내용1 | 첫 번째 탭의 내용을 입력합니다.
| 문자열 | 권장 |
---|
제목2 | 제목2 | 두 번째 탭의 제목을 입력합니다.
| 문자열 | 권장 |
---|
내용2 | 내용2 | 두 번째 탭의 내용을 입력합니다.
| 문자열 | 권장 |
---|
제목3 | 제목3 |
| 문자열 | 선택 사항 |
---|
내용3 | 내용3 |
| 문자열 | 선택 사항 |
---|
제목4 | 제목4 |
| 문자열 | 선택 사항 |
---|
내용4 | 내용4 |
| 문자열 | 선택 사항 |
---|
제목5 | 제목5 |
| 문자열 | 선택 사항 |
---|
내용5 | 내용5 |
| 문자열 | 선택 사항 |
---|
제목6 | 제목6 |
| 문자열 | 선택 사항 |
---|
내용6 | 내용6 |
| 문자열 | 선택 사항 |
---|
제목7 | 제목7 |
| 문자열 | 선택 사항 |
---|
내용7 | 내용7 |
| 문자열 | 선택 사항 |
---|
제목8 | 제목8 |
| 문자열 | 선택 사항 |
---|
내용8 | 내용8 |
| 문자열 | 선택 사항 |
---|
제목9 | 제목9 |
| 문자열 | 선택 사항 |
---|
내용9 | 내용9 |
| 문자열 | 선택 사항 |
---|
제목10 | 제목10 |
| 문자열 | 선택 사항 |
---|
내용10 | 내용10 |
| 문자열 | 선택 사항 |
---|
제목11 | 제목11 |
| 문자열 | 선택 사항 |
---|
내용11 | 내용11 |
| 문자열 | 선택 사항 |
---|
제목12 | 제목12 |
| 문자열 | 선택 사항 |
---|
내용12 | 내용12 |
| 문자열 | 선택 사항 |
---|
제목13 | 제목13 |
| 문자열 | 선택 사항 |
---|
내용13 | 내용13 |
| 문자열 | 선택 사항 |
---|
제목14 | 제목14 |
| 문자열 | 선택 사항 |
---|
내용14 | 내용14 |
| 문자열 | 선택 사항 |
---|
제목15 | 제목15 |
| 문자열 | 선택 사항 |
---|
내용15 | 내용15 |
| 문자열 | 선택 사항 |
---|
제목16 | 제목16 |
| 문자열 | 선택 사항 |
---|
내용16 | 내용16 |
| 문자열 | 선택 사항 |
---|
제목17 | 제목17 |
| 문자열 | 선택 사항 |
---|
내용17 | 내용17 |
| 문자열 | 선택 사항 |
---|
제목18 | 제목18 |
| 문자열 | 선택 사항 |
---|
내용18 | 내용18 |
| 문자열 | 선택 사항 |
---|
제목19 | 제목19 |
| 문자열 | 선택 사항 |
---|
내용19 | 내용19 |
| 문자열 | 선택 사항 |
---|
제목20 | 제목20 |
| 문자열 | 선택 사항 |
---|
내용20 | 내용20 |
| 문자열 | 선택 사항 |
---|
제목21 | 제목21 |
| 문자열 | 선택 사항 |
---|
내용21 | 내용21 |
| 문자열 | 선택 사항 |
---|
제목22 | 제목22 |
| 문자열 | 선택 사항 |
---|
내용22 | 내용22 |
| 문자열 | 선택 사항 |
---|
제목23 | 제목23 |
| 문자열 | 선택 사항 |
---|
내용23 | 내용23 |
| 문자열 | 선택 사항 |
---|
제목24 | 제목24 |
| 문자열 | 선택 사항 |
---|
내용24 | 내용24 |
| 문자열 | 선택 사항 |
---|
제목25 | 제목25 |
| 문자열 | 선택 사항 |
---|
내용25 | 내용25 |
| 문자열 | 선택 사항 |
---|
제목26 | 제목26 |
| 문자열 | 선택 사항 |
---|
내용26 | 내용26 |
| 문자열 | 선택 사항 |
---|
제목27 | 제목27 |
| 문자열 | 선택 사항 |
---|
내용27 | 내용27 |
| 문자열 | 선택 사항 |
---|
제목28 | 제목28 |
| 문자열 | 선택 사항 |
---|
내용28 | 내용28 |
| 문자열 | 선택 사항 |
---|
제목29 | 제목29 |
| 문자열 | 선택 사항 |
---|
내용29 | 내용29 |
| 문자열 | 선택 사항 |
---|
제목30 | 제목30 |
| 문자열 | 선택 사항 |
---|
내용30 | 내용30 |
| 문자열 | 선택 사항 |
---|
|
연습장이나 사용자 문서에서 틀의 사용이나 수정을 연습할 수 있습니다.
분류는
/설명문서에 넣어주세요.