http://scriptogr.am/myevan/post/markdown-syntax-guide-for-scriptogram
마크 다운 문법 가이드
제목
마크다운에서 제목을 쓰는 방법은 밑줄을 치거나 옆에 #을 붙이는 방법 2가지가 있습니다.
밑줄 치는 방법은 텍스트 상태일때 보기가 참 좋습니다. 다만 아쉽게도 크기 조절이 2단계 밖에 안 되는데다, 영어랑 달리 한글은 크기 차이가 거의 구분이 안가네요;;
큰 제목 Big Header
작은 제목 Small Header
큰 제목 Big Header
================
작은 제목 Small Header
--------------------#을 붙이는 방법은 좀더 세분화된 조절이 가능합니다.
제목 Header 1
제목 Header 2
제목 Header 3
제목 Header 4
제목 Header 5
제목 Header 6
# 제목 Header 1 #
## 제목 Header 2 ##
### 제목 Header 3 ###
#### 제목 Header 4 ####
##### 제목 Header 5 #####
###### 제목 Header 6 ######엇; 몰랐는데 뒤쪽 #은 안 붙여도 되는거였군요;;
제목 Header 1
제목 Header 2
제목 Header 3
제목 Header 4
제목 Header 5
제목 Header 6
# 제목 Header 1
## 제목 Header 2
### 제목 Header 3
#### 제목 Header 4
##### 제목 Header 5
###### 제목 Header 6정말 잘 되네요 ~(-_-)~ 왠지 이쪽이 더 나은 것 같은 느낌이…;;
강조
강조는 영어는 기울여쓰기(Italic)과 굵게쓰기(Bold) 를 사용할 수 있습니다.
*기울여쓰기(Italic)*
**굵게쓰기(Bold)**취향에 따라 *표 대신 _ 사용도 가능합니다.
_기울여쓰기(Italic)_
__굵게쓰기(Bold)__기울여서 굵게 쓰고 싶다면 별 셋(***)이나 언더바 셋 (___)을 사용하면 됩니다.
***기울여서 굵게***
___기울여서 굵게___ 스크립토그램을 디폴트 상태로 사용하면 한글에는 강조 설정이 적용이 되지 않는데, css 설정 때문입니다~ 스크립토그램에 구글 웹 폰트 적용하기문서를 토대로 나눔 글꼴로 변경하니 한글에도 Italic 과 Bold 표현이 잘 적용 되네요~
링크
기본 사용법
링크를 표현하는 방법은 3가지가 있습니다. 쉬운 순서대로 나열해보겠습니다.
링크 작성하는 방법입니다.
* 인라인 링크 [Google](http://www.google.com/).
* 참조 링크 [Google] [1].
* 읽기 편한 링크 [Yahoo!].
[1]: http://www.google.com/
[yahoo!]: http://www.yahoo.com/링크 정의는 문서 어디있어도 무방합니다. 단, 링크 정의 이름은 유니크한 문자열이어야 합니다. 대소문자 구분은 하지 않기 때문에 [Yahoo!] 와 [YAHOO!] 는 동일하게 취급됩니다.
툴팁 넣기
링크 위에 마우스 커서를 갖다대고 있으면 poorly-named link처럼 툴팁이 나오게도 할 수 있습니다.
주소 그대로 적기
링크 제목을 적는게 귀찮아서 그냥 URL 주소 그대로 적을때는 <주소>형태로 작성합니다.
주소를 이메일 형식 <me@privacy.net>로 적으면 me@privacy.net 처럼 이메일 작성용 링크로 표시됩니다. 스팸 로봇의 이메일 수집을 조금이라도 귀찮게 하기위해 복합한 형태의 HTML 형태로 변환된다고 하네요~
마크다운에서 변환된 이메일 주소 HTML 코드
<a href="mailto:me@privacy.net">me@privacy.net</a>과연 어느정도 효과가 있을런지…;;
그림
그림 넣는 방법은 링크 넣는 방법과 동일합니다.  형식으로 작성하면 그림이 나옵니다.
.
valid-xhtml10.webp드롭박스 이미지를 넣기 위해서는 공개용 이미지 링크에 약간의 변환 작업을 적용해주어야 합니다.
-
공개용 이미지 주소
https://www.dropbox.com/s/nnoycfa14777vik/pb-20120605-110210.jpg?m -
링크 변경
1. https -> http 2. www -> dl 3. ?m -> 삭제 -
변환한 이미지 주소
http://dl.dropbox.com/s/nnoycfa14777vik/pb-20120605-110210.jpg -
링크 형식 적용
그림 주소는 링크의 레퍼런스 형식을 사용해도 잘 작동합니다.
![valid XHTML][checkmark].
[checkmark]: http://w3.org/Icons/valid-xhtml10
"What are you smiling at?"주의:
현재 마크다운은 단축 레퍼런스 문법인 ![그림 이름] 형식은 지원하지 않는다고 합니다.
![checkmark].하지만 뒤에 [] 를 더 붙여주면 작동한다고 하네요~ 대신 그림 이름이 그림 설명으로 사용된다는 군요~
수평선
수평선을 그리고 싶으면 -, *, '_' 를 3개 이상 나열하면 됩니다.
---
***
___취향에 따라 공백을 넣는 방식도 사용이 가능 합니다.
- - -
* * *
_ _ _인용
기본 사용법
인용하고 싶을 때는 > 를 앞에 넣으면 됩니다.
> The syntax is based on the way email programs
> usually do quotations. You don't need to hard-wrap
> the paragraphs in your blockquotes, but it looks much nicer if you do. Depends how lazy you feel.The syntax is based on the way email programs usually do quotations. You don't need to hard-wrap the paragraphs in your blockquotes, but it looks much nicer if you do. Depends how lazy you feel.
간단하네요~ >ㅁ<)!!
인용에 인용
말꼬리를 물고 늘어질 때 많이 사용하는 인용에 인용을 할때는 > 다음에 공백 넣고 > 을 넣으면 됩니다.
> A: "어제 중국집 가서 짜장면 시켜 먹었는데 정말 맛있더군요." (평범한 문제 제기)
> > B: "짜장면이 뭐가 맛있어요? 우동이 훨 맛있지" (평범한 반론)
> > > C: "우동이요? 에이, 우동보다는 짜장면이죠. 돼지고기도 들어가고." (재반론, A의 의견에 합류)
> > > > D: "짜장면에 돼지고기라면 우동에는 해물이죠. 맛을 안다면 역시 우동!" (재재반론, B의 의견에 합류. ~~을 안다면.. 이라는 말 나왔음)
> > > > > A: "님, 그럼 우동 안 먹는 사람은 맛을 모른단 말인가요?" (말꼬리 잡기 시작)
> > > > > > B: "그만큼 우동이 낫다는 거죠. 에이, 짜장은 느끼해서.." (상대가 좋아하는 것을 깎아내림)
> > > > > > > C: "님께서 짜장면에 대해서 잘 모르시는군요. 제가 설명해 드리죠. (잘 모르시는군요.. 나왔음. 지식과 데이터, 증거, 등등 늘어놓기 시작) A: "어제 중국집 가서 짜장면 시켜 먹었는데 정말 맛있더군요." (평범한 문제 제기)
B: "짜장면이 뭐가 맛있어요? 우동이 훨 맛있지" (평범한 반론)
C: "우동이요? 에이, 우동보다는 짜장면이죠. 돼지고기도 들어가고." (재반론, A의 의견에 합류)
D: "짜장면에 돼지고기라면 우동에는 해물이죠. 맛을 안다면 역시 우동!" (재재반론, B의 의견에 합류. ~~을 안다면.. 이라는 말 나왔음)
A: "님, 그럼 우동 안 먹는 사람은 맛을 모른단 말인가요?" (말꼬리 잡기 시작)
B: "그만큼 우동이 낫다는 거죠. 에이, 짜장은 느끼해서.." (상대가 좋아하는 것을 깎아내림)
C: "님께서 짜장면에 대해서 잘 모르시는군요. 제가 설명해 드리죠. (잘 모르시는군요.. 나왔음. 지식과 데이터, 증거, 등등 늘어놓기 시작)
리스트
기본 리스트
리스트를 작성하기 위해서는 -, +, *을 맨앞에 적으면 됩니다.
- You can use a minus sign for a bullet
+ Or plus sign
* Or an asterisk- You can use a minus sign for a bullet
- Or plus sign
- Or an asterisk
동그라미 대신 숫자를 쓰고 싶다면 숫자 다음 .을 찍습니다. 적힌 숫자랑 상관없이 순서대로 번호가 매겨집니다.
1. Numbered lists are easy
2. Markdown keeps track of the numbers for you
7. So this will be item 3.- Numbered lists are easy
- Markdown keeps track of the numbers for you
- So this will be item 3.
2개 리스트를 순서대로 나열하고 싶다면 리스트 사이 공백을 넣으면 됩니다.
* 리스트1-1
* 리스트1-2
* 리스트1-3
* 리스트2-1
* 리스트2-2
* 리스트2-3- 리스트1-1
- 리스트1-2
리스트1-3
리스트2-1
- 리스트2-2
- 리스트2-3
리스트 안에 리스트
인덴트용 스페이스 4개를 넣으면 리스트안에 리스트를 넣을 수 있습니다.
1. 숫자 리스트 아래
- 인덴트용 공백 4개를 넣었더니 또다시 리스트가
* 공백이 8개면 한단계 더 아래!
- 공백을 4개 넣으면 한단계 위로!- 숫자 리스트 아래
- 인덴트용 공백 4개를 넣었더니 또다시 리스트가
- 공백이 8개면 한단계 더 아래!
- 공백을 4개 넣으면 한단계 위로!
- 인덴트용 공백 4개를 넣었더니 또다시 리스트가
사실 리스트마록 다른 내용을 넣어도 잘 나옵니다.
-
텍스트
엔터 하나 넣고 텍스트를 작성하니…
우와! 쩐다!
-
인용
인용할때도 엔터 하나 넣어야 합니다.
오리님이 말씀하시길…
-
코드
엔터치고 인덴트 4개 넣으면 코드도 작성가능합니다.
#include <stdio.h> int main() { printf("hello, world"); return 0; }
인라인 HTML
마크 다운에서 표현할 수 없는 몇가지 표현 방식은 인라인 HTML 을 통해서 사용할 수 있습니다.
꼭 하고 싶었는데 마크 다운에서 지원하지 못해 표현할 수 없었던 가운데 선 긋기도 <strike> 태그를 사용하면 가능합니다 ~(-ㅁ-)~ 햐햐 Strikethrough humor is funny.
게다가 HTML 안에 마크 다운 문법도 사용 가능합니다.
<u>Markdown works *fine* in here.</u>Markdown works fine in here.
블럭 레벨 HTML 요소들은 몇가지 제약 사항이 있다고 하네요.
- 격리: 주변이 빈 라인으로 둘러싸여서 구분을 시켜줘야 합니다.
- 바깥쪽 시작과 끝 태그는 인덴트를 사용하면 안됩니다.
- HTML 블럭내에서는 마크 다운을 사용할 수 없습니다.
아래는 작성 예제입니다.
<div style="background-color: lightgray">
You can <em>not</em> use Markdown in here.
</div>공백은 잘 지원되려나…
<br/>
소스 코드
소스 코드를 포함할때는 인덴트용 스페이스를 4개 넣으면 됩니다.
printf("goodbye world!"); /* his suicide note
was in C */해당 텍스트는 <pre> 와 <code> 태그에 둘러 싸이게 되며 고정 간격 폰트로 출력이 됩니다. 당연하겠지만 첫 인덴트용 스페이스 4개는 코드 블럭상 보이지 않습니다.
코드 블럭내에는 마크 다운이나 HTML 을 사용할수 없으므로 마크 다운이나 HTML 문법 예제를 보여줄때 사용하면 좋습니다. 간단한 마크 다운 문법이나 HTML 태그라면 ` 로 둘러 싸도 동일한 효과를 얻을 수 있습니다.
예를 들어 "별(*) 별(*) 무슨 별?"이란 문장을 작성하려면 아래처럼 사용해야 합니다.
별(`*`) 별(`*`) 무슨 별?'ECT' 카테고리의 다른 글
| Stack (0) | 2015.06.26 |
|---|---|
| 연결리스트 (0) | 2015.06.25 |
| 시간복잡도 Big O (0) | 2015.01.14 |
| Github master branch 삭제하기 (0) | 2014.08.06 |
| Github error : needs merge (1) | 2014.08.05 |