틀:둘러보기: 두 판 사이의 차이

2024년 3월 19일 (화) 17:19 판

[[../|상위 문서에서 테스트 중]]

기존 둘러보기 틀의 설명문이 상당히 부족하며 내부 구현은 심하게 방대하여 결국 소스를 보고 따라할 수 밖에 없으므로, 완전히 새로운 디자인으로 제작

[[틀:|보기]]·[[틀토론:|토론]]·[[[:틀:Fullurl:틀:]] 편집][[{{{틀이름}}}|{{{제목}}}]]

Type 1	Content1
Type 2	Content2

파라미터 구현

첫번째 파라미터(틀 이름) : O
이름공간 : O
색상 : O
제목 : O
제목n : O(n은 1~20까지)
내용n : O(n은 1~20까지)
분류 : O
너비 : O

@@ 7번째 줄: / 7번째 줄: @@
 <div style="border:3px solid green;position:relative;z-index:0;width:100%;background-color:{{{색상|#a0f0a0}}};">
 <span style="padding:0 2px;white-space:nowrap;position:relative;width:15%;float:left;z-index:2;">[[{{{이름공간|틀}}}:{{{1|}}}|보기]]·[[{{{이름공간|틀}}}토론:{{{1|}}}|토론]]·[{{fullurl:{{{이름공간|틀}}}:{{{1|}}}}} 편집]</span><span style="color:{{{글자색|#408e40}}};position:relative;z-index:1;text-align:center;left:30%;transform:translate(-50%, -50%);">[[{{{틀이름}}}|{{{제목}}}]]</span>
-<div style="background-color:#ffffff;">
+<table style="background-color:#ffffff;width:100%;">
 {{#if: {{{내용|}}}|{{{내용}}}|
-<div>{{#if: {{{제목1|Type 1}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목1|Type 1}}}</span>|}}{{#if: {{{내용1|Content1}}}|<span style="position:relative;display:inline-block;padding:4px;">{{{내용1|Content1}}}</span>|}}</div>
+<tr>{{#if: {{{제목1|Type 1}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목1|Type 1}}}</td>|}}{{#if: {{{내용1|Content1}}}|<td style="position:relative;padding:4px;">{{{내용1|Content1}}}</td>|}}</tr>
-<div>{{#if: {{{제목2|Type 2}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목2|Type 2}}}</span>|}}{{#if: {{{내용2|Content2}}}|<span style="position:relative;display:inline-block;padding:4px;">{{{내용2|Content2}}}</span>|}}</div>
+<tr>{{#if: {{{제목2|Type 2}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목2|Type 2}}}</td>|}}{{#if: {{{내용2|Content2}}}|<td style="position:relative;padding:4px;">{{{내용2|Content2}}}</td>|}}</tr>
-<div>{{#if: {{{제목3|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목3|}}}</span>|}}{{#if: {{{내용3|}}}|<span style="position:relative;display:inline-block;padding:4px;">{{{내용3|}}}</span>|}}</div>
+<tr>{{#if: {{{제목3|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목3|}}}</td>|}}{{#if: {{{내용3|}}}|<<td style="position:relative;padding:4px;">{{{내용3|}}}</td>|}}</tr>
-<div>{{#if: {{{제목4|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목4|}}}</span><br>|}}{{#if: {{{내용4|}}}|<span style="position:relative;display:inline-block;padding:4px;">{{{내용4|}}}</span>|}}</div>
+<tr>{{#if: {{{제목4|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목4|}}}</td>|}}{{#if: {{{내용4|}}}|<td style="position:relative;padding:4px;">{{{내용4|}}}</td>|}}</tr>
-<div>{{#if: {{{제목5|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목5|}}}</span><br>|}}{{#if: {{{내용5|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용5|}}}</span>|}}</div>
+<tr>{{#if: {{{제목5|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{제목5|}}}</td>|}}{{#if: {{{내용5|}}}|<td style="position:relative;padding:4px;">{{{내용5|}}}</td>|}}</tr>
-<div>{{#if: {{{제목6|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목6|}}}</span><br>|}}{{#if: {{{내용6|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용6|}}}</span>|}}</div>
+<tr>{{#if: {{{제목6|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목6|}}}</td>|}}{{#if: {{{내용6|}}}|<td style="position:relative;padding:4px;">{{{내용6|}}}</td>|}}</tr>
-<div>{{#if: {{{제목7|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목7|}}}</span>|}}{{#if: {{{내용7|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용7|}}}</span>|}}</div>
+<tr>{{#if: {{{제목7|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목7|}}}</td>|}}{{#if: {{{내용7|}}}|<td style="position:relative;padding:4px;">{{{내용7|}}}</td>|}}</tr>
-<div>{{#if: {{{제목8|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목8|}}}</span>|}}{{#if: {{{내용8|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용8|}}}</span>|}}</div>
+<tr>{{#if: {{{제목8|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목8|}}}</td>|}}{{#if: {{{내용8|}}}|<td style="position:relative;padding:4px;">{{{내용8|}}}</td>|}}</tr>
-<div>{{#if: {{{제목9|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목9|}}}</span>|}}{{#if: {{{내용9|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용9|}}}</span>|}}</div>
+<tr>{{#if: {{{제목9|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목9|}}}</td>|}}{{#if: {{{내용9|}}}|<td style="position:relative;padding:4px;">{{{내용9|}}}</td>|}}</tr>
-<div>{{#if: {{{제목10|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목10|}}}</span>|}}{{#if: {{{내용10|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용10|}}}</span>|}}</div>
+<tr>{{#if: {{{제목10|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목10|}}}</td>|}}{{#if: {{{내용10|}}}|<td style="position:relative;padding:4px;">{{{내용10|}}}</td>|}}</tr>
-<div>{{#if: {{{제목11|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목11|}}}</span>|}}{{#if: {{{내용11|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용11|}}}</span>|}}</div>
+<tr>{{#if: {{{제목11|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목11|}}}</td>|}}{{#if: {{{내용11|}}}|<td style="position:relative;padding:4px;">{{{내용11|}}}</td>|}}</tr>
-<div>{{#if: {{{제목12|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목12|}}}</span>|}}{{#if: {{{내용12|}}}|<span style="position:relative;overflow-wrap:break-word;idisplay:inline-block;padding:4px;">{{{내용12|}}}</span>|}}</div>
+<tr>{{#if: {{{제목12|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목12|}}}</td>|}}{{#if: {{{내용12|}}}|<td style="position:relative;padding:4px;">{{{내용12|}}}</td>|}}</tr>
-<div>{{#if: {{{제목13|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목13|}}}</span>|}}{{#if: {{{내용13|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용13|}}}</span>|}}</div>
+<tr>{{#if: {{{제목13|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목13|}}}</td>|}}{{#if: {{{내용13|}}}|<td style="position:relative;padding:4px;">{{{내용13|}}}</td>|}}</tr>
-<div>{{#if: {{{제목14|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목14|}}}</span>|}}{{#if: {{{내용14|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용14|}}}</span>|}}</div>
+<tr>{{#if: {{{제목14|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목14|}}}</td>|}}{{#if: {{{내용14|}}}|<td style="position:relative;padding:4px;">{{{내용14|}}}</td>|}}</tr>
-<div>{{#if: {{{제목15|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목15|}}}</span>|}}{{#if: {{{내용15|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용15|}}}</span>|}}</div>
+<tr>{{#if: {{{제목15|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목15|}}}</td>|}}{{#if: {{{내용15|}}}|<td style="position:relative;padding:4px;">{{{내용15|}}}</td>|}}</tr>
-<div>{{#if: {{{제목16|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목16|}}}</span>|}}{{#if: {{{내용16|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용16|}}}</span>|}}</div>
+<tr>{{#if: {{{제목16|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목16|}}}</td>|}}{{#if: {{{내용16|}}}|<td style="position:relative;padding:4px;">{{내용16|}}}</td>|}}</tr>
-<div>{{#if: {{{제목17|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목17|}}}</span>|}}{{#if: {{{내용17|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용17|}}}</span>|}}</div>
+<tr>{{#if: {{{제목17|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목17|}}}</td>|}}{{#if: {{{내용17|}}}|<td style="position:relative;padding:4px;">{{{내용17|}}}</td>|}}</tr>
-<div>{{#if: {{{제목18|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목18|}}}</span>|}}{{#if: {{{내용18|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용18|}}}</span>|}}</div>
+<tr>{{#if: {{{제목18|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목18|}}}</td>|}}{{#if: {{{내용18|}}}|<td style="position:relative;padding:4px;">{{{내용18|}}}</td>|}}</tr>
-<div>{{#if: {{{제목19|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목19|}}}</span>|}}{{#if: {{{내용19|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용19|}}}</span>|}}</div>
+<tr>{{#if: {{{제목19|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목19|}}}</td>|}}{{#if: {{{내용19|}}}|<td style="position:relative;padding:4px;">{{{내용19|}}}</td>|}}</tr>
-<div>{{#if: {{{제목20|}}}|<span style="position:relative;display:inline-block;width:10%;vertical-align:center;text-align:center;background-color:#00A500;color:white;padding:4px;margin:auto;">{{{제목20|}}}</span>|}}{{#if: {{{내용20|}}}|<span style="position:relative;overflow-wrap:break-word;display:inline-block;padding:4px;">{{{내용20|}}}</span>|}}</div>
+<tr>{{#if: {{{제목20|}}}|<td style="position:relative;vertical-align:center;width:10%;text-align:center;background-color:#00A500;color:white;">{{{제목20|}}}</td>|}}{{#if: {{{내용20|}}}|<td style="position:relative;padding:4px;">{{{내용20|}}}</td>|}}</tr>
 }}
-</div>
+</table>
 </div>
 {{{분류|}}}