리버티게임:HTML 문법
리버티게임에서는 HTML(Hyper-Text Markup Language)를 섞어 쓸 수 있습니다. HTML이 뭐냐고요? HTML은 여러분이 보시는 웹 페이지에서 무엇을 어떻게 볼 수 있는지 정해주는 문법입니다. 모든 웹페이지는 기본적으로 HTML로 표기되어야 하며, 위키 문법은 그 중 일부분을 조금 더 사람에게 친숙하게 변형한 것입니다.
리버티게임에서는 일부 HTML 태그를 문서에 직접 삽입할 수 있습니다. 여기서 태그란 <div></div> 같이 왼편에는 /가 없는 <와 >가, 오른편에는 /가 있는 <와 >로 된 한 쌍의 문법 요소를 말합니다. 쉽게 말해서 웹 페이지에 보이는 모든 요소는 왼편과 오른편에 각각 붙는 꺾쇠쌍 형태의 무언가가 있어야 한다는 뜻입니다. 그 무언가가 바로 HTML 태그(HTML Tag)입니다.
다음은 리버티게임이 사용하는 미디어위키 시스템에서 사용하는 HTML 문법 요소입니다. 아래 요소에 한해 리버티게임의 문서를 편집할 때 삽입하면 미디어위키에서 문서를 해석하는 Parsoid가 해당하는 태그를 바꿔줍니다. 그 이외의 HTML 태그는 직접 삽입이 불가능하며, 소도구나 자바스크립트 플러그인으로 집어넣어야 합니다.
div[원본 편집]
div는 블록 영역을 생성하는 가장 기본적인 태그입니다. 블록 영역은 앞과 뒤의 내용과 구분되어 줄바꿈이 되며, CSS로 블록 영역을 이동, 색칠할 수 있습니다. div로 설정할 수 있는 내용은 무궁무진하게 많기 때문에, 자세한 내용은 MDN을 참조하세요.
예를 들자면, 만약 CSS를 활용해 절반 정도의 너비를 차지하며, 'div-ex1' 식별자를 가진 검은색 실선 테두리를 가진 파란색 상자 안쪽 중앙에 '이것은 div 태그의 결과입니다'라는 내용을 흰색 글씨로 적고 싶다면 다음과 같은 형태를 가지게 됩니다.
이것은 div 태그의 결과입니다
span[원본 편집]
span은 텍스트를 묶는 가장 기본적인 인라인 태그입니다. 줄바꿈이 이루어지지 않고 CSS를 통해 위치를 이동시키기 어렵습니다. div 대신 span을 사용한다는 점만 알면 div 태그와 사용법이 같습니다.
표 관련 태그[원본 편집]
- table: 표 전체를 묶습니다. 다른 표 관련 태그는 table 태그 안에서만 사용됩니다.
- tr: 표의 행(줄)을 나타내며, td와 th를 묶습니다.
- td: 표의 각 셀을 나타냅니다.
- th: 제목 역할을 하는 셀을 나타냅니다.
pre[원본 편집]
미디어위키에서 가끔 아래와 같이 맨 처음에 띄어쓰기를 붙여서 특정한 문구를 인용할 수 있습니다.
...그래서 리버티게임에서는 줄 왼쪽에 띄어쓰기를 할 경우 그 줄의 내용을 이렇게 파란 박스로 감쌉니다.
그러나 여러 줄을 써서 미디어위키 문법을 설명하는 용도의 경우, pre 태그로 아래처럼 감싸면 됩니다.
감쌀 내용을 적을 수 있으며, pre 태그 안에서는 nowiki 태그가 없어도 {{CGI}} 같은 틀 인용이나 {{#time:}} 같은 파서 함수 및 미디어위키 문법이 적용되지 않습니다.사용 불가능한 문법[원본 편집]
- script 태그: 자동 실행 문제로 인해 미디어위키에서는 자바스크립트 실행을 HTML 태그 삽입으로 지원하지 않습니다. 자바스크립트 사용이 필요한 경우 PluginX 틀을 활용하시기 바랍니다.
- style, link 태그: #css 파서 함수로 대체합니다.
- a 태그: 미디어위키의 링크 문법으로 대체합니다.
- input, form 태그와 같은 GUI 요소: 확장 기능이 지원하는 경우를 제외하고 구현할 수 없습니다. 자바스크립트를 사용해 동적으로 해당 요소를 mw-parser-output id를 가지는 div 태그 아래에 추가해야 합니다. 리버티게임에서는 틀:입력 상자나 틀:폼과 CIForms 확장기능을 통해 이를 구현하고 있습니다.
- 시맨틱 태그(미디어위키에서 section 태그를 지원하는 이슈가 있으며 여기에는 확장 기능이 section 태그를 사용하는 문제로 인해 해결되지 못하고 있습니다.