김찬 연습장 (연구)

분류:

김찬/연습장

 틀 연구에 대한 내용은 김찬 틀 연습장 문서를 참고하십시오.

김찬 연습장
연습장
메모			낙서			노트			연구			팁			공부			모듈
틀							CSS							Lua

개요

위키 문법 및 시스템과 기능을 연구하고 그에 대해 정리하는 연습장입니다.

그냥 내 연구를 위한 연습장? 메모?장이지만 여러분들에게도 도움 되는 내용이 있을?지도

아쉬운 점

미디어위키! 우리도 <colgroup>이나 <colbgcolor>, <colcolor> 씁시다! 왜 행 방향은 되는데 열 방향은 안 되는가!

접기가 기본적으로 접혀 있었으면 좋겠다. mw-collapsed 클래스나 커스텀 애니메이션 접기 같은 간접적인 방법 말고. 얘넨 원래 펼쳐져 있는 걸 강제로 접은 거라 문서 로딩할 때 잠깐 펼쳐진 게 보인다. <details>나 {{{#!folding }}}처럼 그냥 시스템 자체부터 접혀 있었으면 좋겠다.

모바일에서도 각주 말풍선 제대로 활성화해 줘라! 아주 가끔만 되고 대부분은 그냥 각주 목록으로 이동시켜 버린다. 그 수많은 각주 중에 찾아 읽어야 하고 다시 눌러서 본문으로 이동해야 한다. 불편하구만.

{{MT}}가 필요없는 시대가 왔으면 좋겠다. 그러니까 모바일에서도 너비 미지정 표가 100%로 보이지 않았으면 좋겠다. 그리고 왜 모바일 표는 상단 여백 0.8rem이 없지?

{{탭}} 이건 어케 쓰는 거냐? 나름 위키 문법이랑 CSS 공부 많이 했다고 생각했는데 얜 아직도 모르겠다. 뭐가 문제고 차이길래 리브레에선 되는 게 제이에선 안 되는 걸까?

문서 캐시가 바로 반영되지 않는 게 슬프다. 이를 테면 틀을 수정했거나 파일의 새 판을 올렸을 때다. 그나마 전자는 Alt+⇧ Shift+P로 새로고침하면 바로 반영이 되지만, 후자는 PC에서조차 Ctrl+R을 여러 번 눌러도 안 될 때가 많다.

보일제목

{{보일제목}} 또는 {{DISPLAYTITLE}}은 뒤에 콜론을 붙이고 제목으로 보일 내용을 적으면 그 내용이 문서의 제목으로 보인다.

실제 시스템상 제목이 바뀌는 것이 아니며 보이는 제목만 바뀌는 것이다.

---

제목 안에

• 가능한 것
  • <span> 태그 (하위 속성에 적용 가능한 것이라면 대부분 가능)
  • 각종 글씨 크기 조절 태그
• 불가능한 것
  • <div> 태그
  • <br> 태그 (줄바꿈)
  • <ruby> 태그 (루비 문자)

  • 테이블

  • [[하이퍼링크]]
  • 틀 스타일에 적용된 CSS

---

보일제목은 당연히 한 문서에 하나만 있어야 한다. 두 개 이상 있으면 먼저 온 것만 적용되며 뒤에 온 것들은 오류가 남.

각주 관련

각주 안에 각주를 넣을 시 뒤에 오는 닫는 문법에 오류가 나 버린다.

<ref>각주<ref>안의 각주</ref></ref>

이렇게 뜬다. ↓

</ref>

---

각주 안에 접기를 넣을 시 문서 최하단 각주 목록에서는 접기가 작동하지만 각주 말풍선 기능에서는 작동하지 않는다.

{{ref|{{folding|id=folding-in-reference|접기}}}}

---

각주 안에 표를 넣을 수 있을까?

<ref>
{|class="wikitable"
|-
|테스트||테스트||테스트
|-
|테스트||테스트||테스트
|-
|테스트||테스트||테스트
|}</ref>

잘 된다. 대신 레이아웃이 좀 달라지며 각주 말풍선의 너비가 너무 좁아서 안 이쁘다. 이것도 최하단 각주 목록에서는 괜찮다.

리스트

개수 한계가 있을까?

• 1단계
  • 2단계
    • 3단계
      • 4단계
        • 5단계
          • 6단계
            • 7단계
              • 8단계
                • 9단계
                  • 10단계
                    • 11단계
                      • 12단계
                        • 13단계
                          • 14단계
                            • 15단계
                              • 16단계
                                • 17단계
                                  • 18단계
                                    • 19단계
                                      • 20단계

1. 1단계
   1. 2단계
      1. 3단계
         1. 4단계
            1. 5단계
               1. 6단계
                  1. 7단계
                     1. 8단계
                        1. 9단계
                           1. 10단계
                              1. 11단계
                                 1. 12단계
                                    1. 13단계
                                       1. 14단계
                                          1. 15단계
                                             1. 16단계
                                                1. 17단계
                                                   1. 18단계
                                                      1. 19단계
                                                         1. 20단계

일단 둘 다 20단계까지도 문제없다. 대신 너무 길면 짤린다! 특히 모바일에서 주의!

테이블

wikitable이 모바일과 PC에서 조금 다르다.

PC에서는 테이블의 위아래 전부 0.8rem의 margin이 있지만, 모바일은 위가 없고 아래 여백만 있다.

모바일에서는 표의 너비 지정을 하지 않으면 무조건 100%로 보인다.

---

wikitable 클래스에 적용된 기본 레이아웃

table {
	margin: 0.8rem 0;
	background: #ffffff;
}
caption {
	font-size: 1.2rem;
	padding: 0.2rem 0;
	font-weight: bold;
	text-align: center;
}
td {
	padding: 0.3rem 0.6rem;
	border: 1px solid #e1e8ed;
}
th {
	padding: 0.3rem 0.6rem;
	border: 1px solid #e1e8ed;
	background: #f5f8fa;
	font-weight: bold;
	text-align: center;
}
th.headerSort {
	padding-right: 1.5rem;
}

---

infobox 클래스에 적용된 기본 레이아웃

table {
	border-collapse: separate;
	border-radius: 0.35rem;
	font-size: 13px;
}
caption {
	font-size: 1.2rem;
	padding: 0.2rem 0;
	font-weight: bold;
	text-align: center;
}
td {
	border: 1px solid #e1e8ed;
	padding: 0.3rem 0.6rem;
}
th {
	padding: 0.3rem 0.6rem;
	border: 1px solid #e1e8ed;
	background: #f5f8fa;
	font-weight: bold;
	text-align: center;
}

문법 관련

나무마크와 미디어위키의 문법 차이점

기능	나무마크	미디어위키	비고
볼드체	'''볼드체'''
이탤릭체	''이탤릭체''
취소선	--취소선--	<s>취소선</s>
밑줄	__밑줄__	<u>밑줄</u>
위첨자	^^첨자^^	<sup>첨자</sup>
아래첨자	,,첨자,,	<sub>첨자</sub>
글씨 색	{{{#red 글씨 색}}}	{{c|red|글씨 색}}
글씨 크기	{{{+1 글씨 크기}}}	{{fs|14|글씨 크기}}
하이퍼링크	[[하이퍼링크]]
표	||테이블||테이블|| ||테이블||테이블||	[ 펼치기 · 접기 ] {| |- |테이블 |테이블 |- |테이블 |테이블 |}
이미지	[[파일:이미지.png]]
문단	== 문단 ==	==문단==
리스트1	○*○리스트 ○*○리스트 ○*○리스트	*리스트 *리스트 *리스트
리스트2	○1.○리스트 ○1.○리스트 ○1.○리스트	#리스트 #리스트 #리스트
가로줄	----
HTML	{{{#!wiki style="display: inline; background: yellow; border: 1px solid gray;" HTML}}}	<span style="background: yellow; border: 1px solid gray;">HTML</span>
끼워넣기	[include(문서 제목)]	{{:문서 제목}}
	[include(틀:틀 제목)]	{{틀 제목}}
각주	[* 각주]	<ref>각주</ref>
접기	{{{#!folding 접기 제목 접기 내용}}}	<div class="mw-collapsible mw-collapsed">접기 내용</div>
분류	[[분류:분류 제목]]
문법 무효화	\'''문법 무효화'''	<nowiki>'''문법 무효화'''</nowiki>
넘겨주기	#넘겨주기 문서 제목	#넘겨주기 [[문서 제목]]

기타

틀 안에서 먹통이 되는 문법
이유는 나도 모르겠다.

• <div>
• <span>